gpt4 book ai didi

html - 表格扩展到正文之外 (html)

转载 作者:太空宇宙 更新时间:2023-11-04 11:18:44 25 4
gpt4 key购买 nike

所以发生的事情是我的表格已经扩展到我的 body 上,即使它包含在其中,我认为屏幕截图是显示我在检查它们时超过元素的最佳方式(Chrome ):

正文

enter image description here

tableData(表格包装器)

enter image description here

表格

enter image description here

这是我的代码:

<body>
<main>
<div class="tableData">
<table>
"..."
</table>
</div>
</main>
</body>

我需要我的 body 完全包含 table 以用于样式目的。最好的方法是什么?我需要设置 CSS 溢出属性吗?

最佳答案

浏览器可能决定它不可能将您的表格放入其容器中,而是让它溢出。如果是这种情况,您可以在 .tableData 上设置 overflow-x: auto 以向包装器添加水平滚动条,从技术上讲使表格适合主体。

您当然可以随时调查表格为何如此宽。这可能是因为单元格填充、white-space: nowrap 某处或其他迫使它不必要地宽的东西。

另一个可能的原因,可以解释为什么滚动条不会出现在包装器上,如果表格有 position: absolute(或 fixed),将它超出正常的布局流程。

关于html - 表格扩展到正文之外 (html),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32990196/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com