search

nicolas-t / Chocolat

Chocolat : the lightbox so cool horses use it :horse:
http://chocolat.insipi.de
GNU General Public License v3.0
1.69k stars 169 forks source link

page-layout is moving #122

Closed PetersOtto closed 3 years ago

PetersOtto commented 3 years ago

Hi Nicolas,

I have just a question. When I close the lightbox the page-layout is moving. Its because the scrollbar disappears when the lightbox is open and appears when lightbox is close.

I could use "overflow: scroll;" but then the scrollbar is visible in the lightbox.

Do you have an Idea how I could solve the problem?

Best regards

nicolas-t commented 3 years ago

Hello,

You can try :

body.chocolat-open {
    overflow: auto; /* Keep the scrollbar */
}

Or 

body.chocolat-open {
    overflow: hidden; /* Hide the scrollbar */
    padding-right: 17px; /* Replace it with a margin to avoid layout jumping */
}

The 17px trick is the one used by twitter, margin size may depend on the os/browser, but, you get the idea.

Somewhat related discussion here : https://stackoverflow.com/questions/1417934/how-to-prevent-scrollbar-from-repositioning-web-page

PetersOtto commented 3 years ago

Hello Nicolas. Thank you for supporting! That works for me. Best regards O.