Geek Answers Handbook

How to make a modal scroll with the main page

I have a modal with content above the height of the browser, as a result I have some content that cannot be displayed. (it looks like the modal position is fixed and cannot be scrolled as a whole)

enter image description here

How to make a modal scroll with the main page so that I can view the content below?

+5
source share
2 answers

What you can do is set modal CSS positionas absolute, not fixed.

To do this, simply enter a modal class name or identifier like this, and set it to absolute:

.modal {
position: absolute !important;
}

, , CSS ( ) position fixed absolute.

jsFiddle: http://jsfiddle.net/hUNZs/

+9

<div class="modal myModal"></div>

CSS

.myModal {
      overflow: auto !important; 
      height: 300px; //set a height to a modal so it wont overlapped when the body tag height is smaller than the modal
}
+1

More articles:


All Articles