[英]Twitter Bootstrap sidebar extended to bottom
我正在使用twitter bootstrap,在阅读堆栈溢出的所有答案后将div扩展到底部我想出了我的侧边栏的代码。
body
<div id="wrapper-sidebar">
<div id="content-sidebar" class="text-center">
<h1> hello</h1>
<p>welcome to the admin panel</p>
<p>have a nice stay!</p>
</div>
</div>
css
#wrapper-sidebar
{
margin: 0 auto;
width: 300px;
height: 100%;
padding: 0;
position: absolute;
}
#content-sidebar
{
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
height: 100%;
padding-top: 5px;
}
.text-center
{
text-align: center;
}
现在这确实使侧边栏延伸到我的页面底部,但它也插入了一个滚动条,当我向下滚动时,我的文字被切断了。 任何帮助,将不胜感激。 有没有人知道如何使用bootstrap css类扩展div / sidebar(即height = 100%)?
jfiddle在这里,但它实际上没有显示文本被切断,因此我之前没有发布。
我相信滚动条是由padding-top
和/或border
引入的。 您可能需要降低高度以解决这些问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.