【发布时间】:2013-07-14 06:32:50
【问题描述】:
我正在使用 twitter 引导程序,在阅读了有关堆栈溢出的所有答案以将 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;
}
现在这确实使侧边栏延伸到我的页面底部,但它也插入了一个滚动条,当我向下滚动时,我的文本被截断。任何帮助,将不胜感激。有谁知道如何仅使用引导 css 类来扩展 div/侧边栏(即高度 = 100%)?
jfiddle 是 here,但它实际上并没有显示被截断的文本,因此我之前没有发布过。
【问题讨论】:
-
创建一个 jsfiddle here 并在您的问题中发布链接以获得准确的答案
-
@Answer_42 jfiddle 没有显示被截断的文本,因此没有发布它!但是已经添加了。谢谢。
-
如果 jsfiddle 没有显示文本被截断,请发截图。
标签: html css twitter-bootstrap responsive-design sidebar