我有一个ASP.NET MVC视图,其中包含以下Twitter Bootstrap：
<div class="container">
<div class="container-fluid header">
[Header content]
</div>
<div class="row-fluid">
<div class="span9">
<div class="container-fluid main-content">
[Main Content]
</div>
</div>
<div id="right-sidebar" class="span3">
[Right Sidebar Content]
</div>
</div>
</div>
我的问题是我的[主要内容]比我的[右侧边栏内容]高得多.由于我的[右侧边栏内容]具有不同的背景颜色,我希望它一直向下到我的页脚(我的[主要内容]的完整高度.)
解决方法
我改变了一点结构和元素的类/ ID.
<div class="container-fluid">
<div class="row-fluid header">
[Header content]
</div>
<div id="parent" class="row-fluid">
<div class="span9 main-content">
[Main Content]
</div>
<div id="right-sidebar" class="span3">
[Right Sidebar Content]
</div>
</div>
</div>
而现在的CSS：
#parent{
position: relative
}
#right-sidebar{
position: absolute;
right: 0;
height: 100%;
background: blue;
}
.main-content{
background: red;
}
