css - 表格布局 : fixed ignores td's min-width

标签 css css-tables tablelayout

我有一个元素需要一个包含固定宽度和灵活宽度列的表格。

无论浏览器的宽度如何,某些列的宽度始终需要 80 像素。

其余的列需要有灵活的宽度,但都是等宽的,最小宽度为75px;

通过添加table-layout:fixed;对于表格,我能够使灵活宽度的列都具有相同的宽度,但是然后表格会忽略 td 的 min-width 属性。

如果我删除 table-layout:fixed,最小宽度有效,但灵活宽度列都有不同的宽度(基于它们包含的文本的长度)。

列数根据从数据库中提取的数据而变化。

我已经在 jsfiddle 上放了一个带有 table-layout:fixed 和 min-width 的表格示例:http://jsfiddle.net/7d2Uj/

关于如何让 min-width 在这种情况下起作用的任何想法,或者为什么会发生这种情况?

最佳答案

我的解决方法是将表格压缩到列几乎重叠的位置,检查此时的表格宽度,然后设置 <table> 的最小宽度元素本身到那个值。如果您的固定布局包含一个可扩展列,则此技术也很有用,否则随着窗口缩小,扩展列将完全消失。

例如:http://jsfiddle.net/KTCfs/

关于css - 表格布局 : fixed ignores td's min-width,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7019002/

相关文章:

jquery - 表格行可以展开和关闭吗?

html - 合理元素中的链接

html - 更改 div 以适应浏览器大小时,Div 的内容不会缩放?

javascript - Internet Explorer 中 style.filter 的默认值

jquery - 创建单元格的对 Angular 线边框

javascript - 可滚动表格不显眼的脚本

css - Safari 中未加载 Material Icons 和 Roboto - 仅限 Safari

html - Bootstrap 4 : Responsive Button with an Icon on the Left

html - 具有固定位置的 CSS 表格页脚

CSS 样式冲突