Can I use? http://caniuse.com/ Less http://lesscss.org Cool Libraries Bootstrap from Twitter Jetstrap
这是一个创建于 3432 天前的主题，其中的信息可能已经有所发展或是发生改变。
我在一个固定宽度的 td 里面放了一个 span ，然后 span 设置了一个百分比宽度以及 overflow:hidden 。不知道为什么， td 会被撑开。。如图 
我不想让 span 把 td 撑开需要怎么做呢。。。
 | 1 suinia 2016-08-03 17:10:54 +08:00  1 word-break: break-all; |
 | 3 abelyao 2016-08-03 17:18:10 +08:00 截图中浏览器的运行效果来看，最后一个 a 是半截的，确实有一部分 hidden 了？ 不然上代码吧 |
 | 4 chairuosen 2016-08-03 17:19:48 +08:00 span 是 inline 级的，没有宽度属性，设置也不生效，先 display: block or inline-block |
 | 5 Pan940425 OP @abelyao @chairuosen <!DOCTYPE html> <html> <head> </head> <body> <table> <tr> <td style="width:200px;border:1px solid"> <span style="width:80%;display:inline-block;overflow:hidden;margin-left:10%;">11111111111111111111111111111111111111111111111111111111111111111111111</span> </td> </tr> </table> </body> </html> |
| 6 Pan940425 OP @chairuosen 已经加了 display:block 呢， |
| 10 chairuosen 2016-08-03 17:28:33 +08:00 @Pan940425 table 单元格宽度比较奇怪，给 table 一个 table-layout:fixed; |
 | 12 learnshare 2016-08-03 17:35:07 +08:00 td 里不要放任何 display: block; 的元素，只放 inline/inline-block 的元素。 |
 | 13 baiyi 2016-08-03 17:36:29 +08:00 貌似是 span 的宽度%没有按照上级 td 的走 要不要换一个思路 用 js 通过 td 的宽度来给 span 一个固定宽呢 |
| 14 Pan940425 OP |
| 15 Pan940425 OP @learnshare 改成了 display:inline-block ，还是会撑开。。 |
| 16 Pan940425 OP @baiyi 用 js 应该是可以做到，但是因为好多不同的地方都有同样的 span 撑开 td 的问题，想要改动最小，希望可以在每个出问题的 td 上增加一个 class 就行，所以还是希望可以用 css 来解决。。 |
| 17 abelyao 2016-08-03 17:44:31 +08:00 @Pan940425 我是这么测试的： <!DOCTYPE html> <html> <head> <title></title> </head> <body> <table style="width:200px;table-layout:fixed;"> <tr> <td style="width:200px;"> <span style="display:block; overflow:hidden; width:80%; margin-left:10%;">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</span> </td> </tr> </table> </body> </html> |
| 19 baiyi 2016-08-03 17:46:01 +08:00 height: 20px; word-break: break-all;//强制英文单词断行 给 span 加上这两个属性 |
| 20 chairuosen 2016-08-03 17:47:11 +08:00 @Pan940425 看来我记错了， table-layout 只控制 table 本身，不控制 td 。。。如果非要限制 td 宽度的话， Chrome 上 max-width 是有效的，不清楚 IE 上的情况 |
 | 21 guxin0123 2016-08-03 19:14:47 +08:00 table-layout :fixed 是只计算首行的列宽并根据其固定所有列宽 可以在第一个 tr 里面的 td 给宽度 如果第一行都是不固定的话 可以这样 <table style="table-layout:fixed"> <colgroup> <col style="width:60%"> <col style="width:20%"> <col style="width:20%"> </colgroup> <tr> <td>11</td> <td>22</td> <td>33</td> </tr> </table> |
 | 22 yangg 2016-08-03 19:52:52 +08:00 table { table-layout:fixed; word-break: break-all; } |
| 23 Pan940425 OP |
Select Language