All geek questions in one place

Problem with 100% height for sidebar (panel) in twitter bootstrap

I have problems when I use the sidebar (panel) in twitter bootstrap. Here is the binding of this sidebar (panel).

enter image description here

And here is my CSS code for it.

.sharecartside .content { height: 100% !important; min-height: 100%; padding: 18px 10px 20px 30px; } .sharecartside { height: 100%; margin: 1px 0 0 508px; } .sharecartside { background: url("../images/bg_sidepannel.png") repeat-y scroll 0 0 transparent; float: right; margin: 1px 0 0 400px; position: absolute; width: 300px; }

Any help would be appreciated. Thanks.

+4
source share
1 answer

To make "height: 100%" work for any HTML element, its parent element must have a height value. Or the element will expand to the height of the nearest ancestor with a certain height.

If all the ancestors of the element do not have a height defined or defined as a percentage, then in order for the element to expand to the height of the page, you must give both the "body" and the "html" 100 percent height.

If you are using a boot answer using

  html,body{ height:100%}

in css should solve the problem. Make sure this rule appears after enabling bootstrap-responsive.css

+8
source

Source: https://habr.com/ru/post/1491569/

More articles:


All Articles