I'm in trouble when I use Sidebar (Panel) in twitter bootstrap. Here Is snap of that Sidebar (Panel).
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 will be appreciated. Thank you.
In order to make 'height:100%' work for any HTML element, its parent item should have a height value defined. Or the item will expand to height of the nearest ancestor with a height defined.
If all the ancestors of an element have no height defined or defined in percentage, then in order to have the element to expand to the height of the page, you should give both 'body' and 'html' a 100% height.
If you are using bootstrap responsive, using
html,body{ height:100%}
in css should solve the problem. Make sure that this rule appear after you includes bootstrap-responsive.css
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With