当前位置:  开发笔记 > 前端 > 正文

如何防止我的html表拉伸

如何解决《如何防止我的html表拉伸》经验,为你挑选了2个好方法。

有时,当我的一个表格单元格中的一段数据太长时,它会拉伸单元格并使整个表格的布局变形.我怎么能阻止这个?



1> artificialid..:

您可能想要table-layout:fixed并在行的第一个单元格上设置宽度.

有关详细说明,请参见http://www.w3.org/TR/CSS2/tables.html#fixed-table-layout.



2> Shawn..:

我只是遇到了同样的问题,最终解决了这个问题:

table { width: 1px; /* This ugly hack allows the table to be only as wide as necessary, breaking text on spaces to allow cells to be less wide. */ }

显然,将表的宽度设置为很小的值会迫使它分解文本并占用较少的水平空间。但是单词不会被打断,因此该表最终至少要足够大以容纳每一列的最大单词。

经过以下测试并证明是正确的:

Linux(Ubuntu 10.04)

Firefox 3.6.18

铬浏览器12.0.742.112(90304)意味着什么

Konqueror 4.5.3

SeaMonkey 2.0.11

视窗:

Internet Explorer 7

Firefox 4.0.1

如果有人(我目前无法满足)可以在IE,Firefox,Chrome,Safari和Opera的最新版本上进行测试并发表评论或编辑此答案,那就太好了!

推荐阅读
手机用户2402851335
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有