【问题标题】:adjust main container width according to table width根据表格宽度调整主容器宽度
【发布时间】:2026-01-06 05:55:01
【问题描述】:

是否有可能..如果表格宽度增加,那么它的主要容器宽度也会随之增加。有可能吗??

 <div class="container main-con">
    <table class="table table-hover"> <tr><td></td></tr>
     </table>
  </div>

如果表格中的数据增加,那么表格将出现在容器之外。那么是否可以根据表格宽度增加主容器的宽度

【问题讨论】:

  • 不,容器是固定宽度或流动的,这意味着浏览器窗口的宽度。您想在这里实现什么目标?
  • 先生,我在容器中有容器,我有桌子。如果表数据增加,那么表就在容器之外
  • 所以我想根据表格宽度增加容器宽度

标签: javascript css html twitter-bootstrap


【解决方案1】:

拥有比屏幕宽的容器几乎总是非常糟糕的用户体验。人们(有充分的理由)不喜欢左右滚动。相反,你最好只让你的表格向左/向右滚动。

您应该能够通过使表格具有响应性来轻松实现这一点。来自Bootstrap docs

通过将任何 .table 包装在 .table-responsive 中以使它们水平滚动来创建响应式表格

例如:

<div class="table-responsive">
    <table class="table table-hover">
        <tr>
            <td></td>
        </tr>
    </table>
</div>

【讨论】:

  • 先生不想使用 table-responsive 。我已经这样做了
  • 如果你真的非常希望你的表格比屏幕宽,那么不要把它放在container
  • 我已将其放入容器中...案例 1. 如果表格中的数据宽度增加...则表格从容器中出来
最近更新 更多