我正在尝试在HTML页面的右侧创建一个最小宽度的两列html表。
目前的想法:
我应该在我的值前面创建第三列,并以某种方式最大化其宽度,将两个紧凑的列一直向右移动?
我应该将整个表格包裹在<div>
并使用正确的理由吗?
我正在使用Bootstrap CSS,使用JS类有更简单的方法吗?
提前谢谢你,
<table cellspacing="0" class="table table-bordered">
<tr>
<td>SPACER</td>
<td>PRICE UPDATE: </td>
<td>{{price_update}}</td>
</tr>
<tr>
<td>SPACER</td>
<td>POSITION UPDATE: </td>
<td>{{pos_update}}</td>
</tr>
</table>
答案 0 :(得分:1)
对引导网格系统的一点阅读可能有所帮助(http://www.helloerik.com/the-subtle-magic-behind-why-the-bootstrap-3-grid-works)。
您可以使用偏移量和列来轻松完成此操作。例如:
<div class="col-xs-offset-9 col-xs-3">
<!-- insert table here -->
</div>
Bootstrap工作在12s(这就是你需要9的偏移量,或者任何会偏移你需要的列大小的原因)。 xs
是您希望在其上显示的屏幕尺寸,因此在这种情况下,xs
将显示在每个屏幕尺寸的右侧,但如果您希望它仅显示在iPad或PC上您必须更改它,然后您可以添加您希望它显示给较小设备的方式。
还要确保将所有列放在容器和行中。