码迷,mamicode.com
首页 > 其他好文 > 详细

table td 的溢出隐藏

时间:2018-01-07 15:53:14      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:隐藏   psi   今天   pac   class   div   log   post   默认   

今天碰到一个问题,就是在一个双列的表格布局中,我想让 左边一列宽度为 40%,右边一列宽度为60%;

然后依次设置左边td宽度40%和右边td宽度60%,状态显示正常,宽度也正常。但是当 右边的td内部的内容宽度大于60% 的时候,并没有换行,而是让右边的td宽度超过了60%,而左边的td表格小于40%;致使表格结构直接崩溃。

而 给右边td  设置 overfolow:hidden;white-space:nowrap;text-overflow:ellipsis;  却不能生效。

原因是 table 的宽度流,会根据内容大小更改td的宽度。而设置宽度只能是初始宽度,有个默认的效果,一旦内容超出,宽度设置就会失效。

 

解决方法; 给table  设置 table-layout:fixed;  该属性可以将 table的流式布局更改为 固定布局,这时 给td 设定的宽度可以一直生效,且 设置的溢出隐藏效果也可以生效。

table td 的溢出隐藏

标签:隐藏   psi   今天   pac   class   div   log   post   默认   

原文地址:https://www.cnblogs.com/RoadAspenBK/p/8227798.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!