html:
<div class="container">
<div class="row" style="height: 512px">
<div class="col-sm-9">
<div class="firstDiv"></div>
<div class="dataTablesWrapper">
<table id="myDataTable">
<thead></thead>
<tbody></tbody>
</table>
</div>
</div>
<div class="col-sm-3 thirdDiv"></div>
</div>
</div>
我正在尝试将我的数据表放在 col-sm-9 类中,以便它能够响应并在调整大小时堆叠。但是发生的事情是它堆叠在我的 col-sm-3 类 div 之上并阻止了它。我似乎找不到任何关于如何构建数据表以使其具有响应性的示例。我想要的是这样的:
col-sm-9 col-sm-3
------------- -------------
| firstDiv | | thirdDiv |
| height:50%| |height:100%|
------------- | |
------------- | |
| dataTable | | |
| height:50%| | |
------------- -------------
高度是行高的百分比。
我希望“.thirdDiv”堆叠在 firstDiv 和 dataTable 之下。目前它堆叠在 dataTable 后面。
最佳答案
在 col-sm-9 中创建两个 .row 类,并将您的第一个 div 和数据表放在每一行上。
Here is the sample
关于jquery - 带有数据表的 Bootstrap 未正确堆叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38580082/