我正在尝试使用 Bootstrap 提供的研磨系统构建一个 bootstrap 计算器。我有两行使用 col-md-4 类,每行包含 4 个按钮。我希望看到按钮扩展整个 div 标签的宽度。当我将背景颜色添加到 div 标签时,颜色会填充整个 div 标签,但我会异常(exception)。我创建了一个代码笔来说明我的问题。
<div class="container">
<div class="cal-body">
<div class="header">
</div>
<div class="lcd">
</div>
<div class="row">
<div class="col-md-4">
<button>7</button>
<button>8</button>
<button>9</button>
<button>%</button>
</div>
</div>
<div class="row">
<div class="col-md-4" style="margin-bottom: 20px;">
<button>4</button>
<button>5</button>
<button>6</button>
<button>X</button>
</div>
</div>
</div>
</div>
</div>
换句话说,我希望我的按钮占据列行的整个长度。截至目前,它只占用了列空间的 1/4。我正在尝试复制计算器的外观。 我的码笔:http://codepen.io/louis345/pen/KNoypX
任何帮助将不胜感激。
最佳答案
如果您想跨越整行,只需将 col-md-4
更改为 col-md-12
。
您还可以将类 text-center
添加到您的列中以使按钮居中。
示例:
<div class="col-md-12 text-center">
</div
关于css - Bootstrap 按钮和列扩展整个 div 标签的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41234158/