我刚开始使用Twitter Bootstrap，我有一个问题，如何最好添加边框到父元素？
例如，如果我有
<div class="main-area span12">
<div class="row">
<div class="span9">
//Maybe some description text
</div>
<div class="span3">
//Maybe a button or something
</div>
</div>
</div>
如果我应用这样的边框：
.main-area {
border: 1px solid #ccc;
}
网格系统将打破和踢span3到下一行，因为边框的添加宽度……有一个很好的方法，以便能够添加诸如边框或填充到父< div>喜欢这个？
解决方法
如果你看看Twitter自己的
container-app.html演示在GitHub，你会得到一些使用边框与他们的网格的想法。
例如，下面是其940像素宽的16列网格系统的构建块的提取部分：
.row {
zoom: 1;
margin-left: -20px;
}
.row > [class*="span"] {
display: inline;
float: left;
margin-left: 20px;
}
.span4 {
width: 220px;
}
为了允许在特定元素上的边框，他们添加嵌入CSS到页面，减少匹配类足够的量来解释边框。
例如，要允许边栏上的左边框，他们将此CSS添加到< head>之后的主< link href =“../ bootstrap.css”rel =“stylesheet”> ;.
.content .span4 {
margin-left: 0;
padding-left: 19px;
border-left: 1px solid #eee;
}
你会看到他们已经减少填充 – 左1px，以允许添加新的左边框。由于此规则稍后出现在源顺序中，因此它将覆盖任何先前或外部声明。
我认为这不是最健壮或优雅的方法，但它说明了最基本的例子。
