使数据表适合 div

Make datatable fit inside div

我目前有一个数据表由于某种原因无法放入 div 中,有谁知道如何将它“挤压”到一起以便它适合我的 div 并且不会必须滚动

代码:

<div class="container"  style="margin: 0.1%;">
<table id="myTable" class="display compact" style="width:99%">
    <thead>
        {% for col in column_names %}
    <th>{{col}}</th>
    {% endfor %}
    </thead>
    <tbody>
        {% for row in row_data %}
        <tr>
            {% for col, row_ in zip(column_names, row) %}
            {% if col == link_column %}
            
            {% else %}
            <td>{{row_}}</td>
            {% endif %}
            {% endfor %}
        </tr>
        {% endfor %}
    </tbody>
</table>

数据表往往会故意溢出,因为列太宽了。

您有两个选择:

  1. 删除列以使其适合 div 元素
  2. 在包含 div 的 css 中将 overflow-y 设置为滚动或自动。这将切断 div 之外的任何内容,并允许用户滚动查看它。