【发布时间】：2010-09-08 13:42:44
【问题描述】：
总结
确保表格单元格不能小于某个最小宽度的最佳方法是什么。
示例
我想确保表格中的所有单元格相对于表格容器的宽度至少为 100 像素宽。如果有更多可用空间，表格单元格应填满该空间。
浏览器兼容性
我可能想找到一个可行的解决方案
- IE 6-8
- FF 2-3
- 野生动物园
按优先顺序排列。
【问题讨论】：
标签： html css html-table
【发布时间】：2010-09-08 13:42:44
【问题描述】：
这个 CSS 应该足够了：
td { min-width: 100px; }
但是，并非所有浏览器都正确遵守它（min-width 属性）（例如，IE6 非常不喜欢它）。
编辑： 至于 IE6（及之前）的解决方案，据我所知，没有一个在所有情况下都能可靠运行的解决方案。使用 nowrap HTML 属性并不能真正达到预期的结果，因为它只是防止单元格中的换行符，而不是指定最小宽度。
但是，如果将 nowrap 与常规单元格宽度属性结合使用（例如使用 width: 100px），则 100px 将作为 最小宽度，并且单元格仍会随文本扩展（由于没有包装）。这是一个不太理想的解决方案，它不能完全使用 CSS 应用，因此，如果您有许多表要应用它，那么实施起来会很乏味。 （当然，如果您想在单元格中使用动态换行符，那么整个替代解决方案都会失败。
【讨论】：
另一个hack是旧的 1x1 透明像素技巧。插入一张 1x1 透明 gif 图片，并在图片标签中将其宽度设置为您想要的宽度。这将强制单元格至少与图像一样宽。
【讨论】：
-
跨浏览器 css 中是否存在 hack？我认为只有标准和“人们真正在做什么”。
-
这是一个相当过时的黑客......有更好的方法来解决这个问题，而无需仅为它加载单独的图像，即使其他方法也是黑客。
我知道这是一个老问题，但我想我会分享一些没有提到的东西（虽然概念上很简单..）你可以在表格中放一个 <div>（在 @987654322 之一中） @'s 或其他东西）并将<div> 设置为min-width。表格将停在<div> 的宽度处。只是想我会把它扔在那里，以防有人在谷歌上遇到这个问题。另外，我不太确定在 I.E6 中如何处理 min-width 。但这已经包含在另一个答案中。
【讨论】：
我取得了一些成功：
min-width: 193px;
width:auto !important;
_width: 193px; /* IE6 hack */
基于 Vatos 的回复和此处的最小高度文章：http://www.dustindiaz.com/min-height-fast-hack/
【讨论】：
这个css属性怎么样
min-width: 100px
但如果没记错的话，它在 IE6 中并不能真正工作
如果你不想用css的方式做，我想你可以添加这个属性
nowrap="nowrap"
在您的表格数据标签中
【讨论】：
这是一种用于设置最小宽度和/或最小高度的跨浏览器方式：
{
width (or height): auto !important;
width (or height): 200px;
min-width (or min-height): 200px;
}
IE 6 不理解！重要
IE 6 看到 width/height:200px (覆盖自动)
其他浏览器理解 min- 和 !important
我不是 100% 熟悉 TD 元素中的宽度行为，但这一切都适用于例如 DIV 标记
顺便说一句：
基于 Vatos 的回复和此处的最小高度文章：http://www.dustindiaz.com/min-height-fast-hack/
由于前两行的顺序，这不起作用，它们需要按正确的顺序排列（想想上面的内容）;)
【讨论】：
IE6 将宽度处理为 min-width:
td {
min-width: 100px;
_width: 100px;/* IE6 hack */
}
如果你想让 IE6 像普通浏览器一样处理宽度，给它一个 overflow:visible; （这里不是）
【讨论】：
-
这似乎不起作用，单元格没有保持最小宽度。如果将浏览器调整为 150 像素，则单元格宽度会减小到 100 像素以下。