我有以下 div，我试图按特定顺序对齐。我想让它们排成两行，div 始终向左对齐。
我这里有相同的代码:Code on Plnkr
下面是一段代码:
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>I have to be left aligned</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
同样的实时预览在这里:Live preview
如何让第四个 div 左对齐。
最佳答案
您可以将前三列包装在 行 中，然后将最后一列包装在另一 行 中。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
</head>
<body>
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
<div class="col-md-4 col-sm-6 col-xs-12">
<table class="table">
<tr class="info"><td><b>Row 1</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
</div>
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12" style="float:left;">
<table class="table">
<tr class="info"><td><b>I have to be left aligned</b></td></tr>
<tr><td>item</td></tr>
<tr><td>item</td></tr>
<tr><td></td></tr>
</table>
</div>
</div>
</body>
</html>
这里是 plunker:http://plnkr.co/edit/8SSAsT76bHNdSvThhl0v?p=preview
关于html - 使用 bootstrap css 左对齐 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28526409/