无法更改固定布局中的列大小 table

Question

我有一个 html 页面，其中有几个 div 个容器，其中一个容器有一个 table。我正在使用外部样式 sheet，无论我尝试什么，我都无法调整第一列的大小。
我已经设置了 "table-layout: fixed;" 并尝试在该列上使用 "width" 和 "max-width"，但是我做的任何事情都不会让我重新调整该列的大小。
希望有人能指出为什么无法调整此列的大小？
其他一些属性是否阻止了此调整大小的工作？ div 容器之一是否会在此处引起问题？

https://jsfiddle.net/Shiroslullaby/ahstbwd5/2/

我有一些额外的 CSS 但是它会做一些事情，比如在悬停时突出显示，我会保持一切完好无损，因为它在这里引起问题的可能性很小。

HTML:

<html>
<head>
    <title>Customers</title>
    <link rel="stylesheet" href="test2.css">


</head>
<body>
    <div id="header"></div>
    <div id="container">
    <div class="left">

    <table class="customertable">
<thead>    
<tr>
<th class="shortcolumn">id</th><th>businessName</th><th>contactName</th>  
 <th>contactEmail</th>
</tr>
</thead>
<tbody> 
<tr>
<td>1</td><td>Microsoft</td><td>Bill Gates</td><td>Bill@Microsoft.com</td>
</tr>
<tr>
<td>2</td><td>Amazon</td><td>Jeff Bezos</td><td>Jeff@Amazon.com</td>
</tr>
</tbody>
</table>
    </div>
    <div class="right"><div id="fixedright"></div></div>
    </div>
    <div id="footer"></div>
 </body>
</html>

CSS:

.customertable {
table-layout: fixed;
overflow-x:auto;
width: 100%;
word-wrap: break-word;
 }

.shortcolumn {
 max-width: 10%;
}


#container {
position: relative;
width: 100%
}

div {
 border-radius: 5px;
}

#header {
 height: 50px;
 background-color: #F38630;
 margin-bottom: 10px;
}

.left {

 width: 75%;
 background-color: #A7DBD8;
 margin-bottom: 10px;

}

.right {
 height: 100%;
 width: 25%;
 background-color: #E0E4CC;
 position: absolute;
 top: 0px;
 right: 0px;
 bottom: 0px;
 margin-bottom: 10px;

 }

#footer {
  height: 50px;
  background-color: #69D2E7;
  clear: both;
}

#fixedright {
 height: 50px;
 width: calc(25% - 6px);
 background-color: #FFFFFF;
 position: fixed;
 margin: 1px 1px 1px 1px;
}

thead {
background: #231E5E;
color: #FFF;
}

tbody tr:nth-child(odd) {
background: #E9F5D7;

}

tbody tr:hover {

background-color: #86C133;
}

Answer 1

给你...已修复！

https://jsfiddle.net/ahstbwd5/3/

Table 单元格不接受 max-width，仅接受 width...

无法更改固定布局中的列大小 table

Unable to change column size in fixed layout table

html

css

html-table

tablelayout