Skip to content

Modal Scrolling #4701

Closed Answered by elizabetdev
anuragxxd asked this question in Q&A
Discussion options

You must be logged in to vote

Hi @git-anurag-hub 👋🏽 ,

If the content inside your <EuiModalBody /> is very long, the modal will scroll vertically. You don't need to do anything. It works like that by default.

<EuiModal onClose={closeModal}>
  <EuiModalHeader>
    <EuiModalHeaderTitle><h1><!-- Modal title --></h1></EuiModalHeaderTitle>
  </EuiModalHeader>

  <EuiModalBody>
    <!-- Modal body with a very long content -->
  </EuiModalBody>

  <EuiModalFooter>
    <EuiButton onClick={closeModal} fill>Close</EuiButton>
  </EuiModalFooter>
</EuiModal>

You can see this CodeSandbox with an example of a modal with multiple paragraphs inside the <EuiModalBody />.

Let me know if that helped.

Replies: 2 comments

Comment options

You must be logged in to vote
0 replies
Answer selected by anuragxxd
Comment options

You must be logged in to vote
0 replies
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Q&A
Labels
None yet
2 participants
Converted from issue

This discussion was converted from issue #4700 on April 11, 2021 14:27.