Item container scrolling when the screen height changes

shabspb 0
Viewed 28

Here is the structure of my site Codesandbox, it consist of a video player and settings part with list of some notifications. I need to add item container scrolling when the screen height changes. Only the container with class PreviewWrapper with the list of notifications should be able to scroll when the screen height changes. Could you help me resolve this problem?

enter image description here

overflow flexbox reactjs javascript css
1 Answers

You need to add a fixed height for the section bar for example 200px and make the overflow: auto;

.PreviewWrapper {
  padding: 0 2rem 2rem 2rem;
  display: block;
  height: 200px;
  overflow: auto;
}

Also, you need to add height: 100% for the element has class .AppWrapper to take the full height of it's parent

.AppWrapper {
  display: flex;
  height: 100%;
}

CODESANDBOX

userYBSN0
Related