html 表格最小宽度,html – CSS’min-width’增加表格单元格的宽度大于值

我觉得我错过了什么.我有一个< table>设置为宽度：100％;我添加CSS以防止列变得比50px窄.这是一个简单的场景.

我的问题是,即使宽度小于最小宽度值,应用最小宽度的列也会变宽.

问题示例：我应用min-width：50px;对于宽度为123px的td元素,td增加到167px的宽度.我期望应用最小宽度：50px;到渲染宽度为123px的元素,不更改元素宽度.

运行以下代码并执行以下步骤可以重现我的问题：

>检查表格第一列的宽度

>验证列的宽度是否大于50px

>如果第一列的宽度小于50px,请增加浏览器窗口的宽度.

>当第一列的显示宽度大于50像素时,单击表格下方的按钮.

>尽管不小于最小宽度值,但第一列的宽度应该增加.

注意：单击该按钮将切换应用于表格单元格(th和td元素)的类,这些类格式构成表格的第一列.该类适用于最小宽度：50px;.

任何不影响计算宽度大于50px且样式属性宽度：auto的表格单元格(th或td)的解决方案都将考虑解决此问题.设置最小宽度时：50px.

我使用的是谷歌浏览器版本46.0.2490.80米.

任何帮助/见解将不胜感激.谢谢.

$("button").click(function() {

$("table tr > *:nth-child(1)").toggleClass("min-width-test")

});

table {

width: 100%;

}

table,table * {

border: 1px solid black;

}

.min-width-test {

min-width: 50px;

}

First	Second	Third	Fourth
1	2	3	4
A	B	C	D

Toggle min-width on first column