我试图按照SMACSS原则使我的CSS尽可能模块化。我有一个我一次又一次使用的布局,所以我想为它制作一个CSS模块。以下是我所拥有的。
它是一个2柱全宽液体布局,其中第一个柱子占据尽可能多的空间,第二个柱子尽可能少地取出。
<div class="table-layout-cont-new">
<div class="table-layout-col-1-new">
<input type="number" class="form-control form-control-default-new" placeholder="400">
</div>
<div class="table-layout-col-2-new">
<a class="form-tooltip-new glyphicon glyphicon-question-sign" href="#">
<span class="sr-only">Information</span>
</a>
</div>
</div>
input {
width: 100%;
}
.table-layout-cont-new {
display: table;
width: 100%;
}
.table-layout-col-1-new {
display: table-cell;
vertical-align: top;
padding-right: 10px;
}
.table-layout-col-2-new {
display: table-cell;
width: 1px;
vertical-align: top;
}
http://codepen.io/anon/pen/EaWRKe
我正在使用Twitter Bootstrap 3.是否已经提供了同样的东西?