Question

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之上并阻止它。我似乎无法找到有关如何构建dataTables以便它具有响应性的任何示例。我想要的是这样的：

   col-sm-9     col-sm-3
------------- -------------
| firstDiv  | | thirdDiv  |
| height:50%| |height:100%| 
------------- |           |
------------- |           |
| dataTable | |           |
| height:50%| |           |
------------- -------------

高度是行高的百分比。

我想要＆＃34; .thirdDiv＆＃34;将堆叠在firstDiv和dataTable下面。目前它堆叠在dataTable后面。

Answer 1

在col-sm-9中创建两个.row类，并在每一行上放置第一个div和datatable。

Here is the sample

https://plnkr.co/edit/AkkEoStEIVaJGL5I3E4I?p=preview

DataTables无法正确堆叠的引导程序

1 个答案: