paste the code directly, the requirement is very simple, the width of three columns is specified, and the content beyond part shows . . When there is no more cospan header column, there is no problem, and after that, the width is evenly distributed.
<!DOCTYPE html>
<html lang="zh-ch">
<head>
<meta charset="UTF-8">
<title>Table | Test</title>
<style type="text/css">
table.gridtable {
width: 352px;
font-family: verdana, arial, sans-serif;
font-size: 12px;
color: -sharp333333;
border-width: 1px;
border-color: -sharp666666;
border-collapse: collapse;
table-layout: fixed;
}
table.gridtable td {
/*width: 100px;*/
padding: 8px;
border-width: 1px;
border-style: solid;
border-color: -sharp666666;
background-color: -sharpffffff;
word-break: break-all;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
td.td-width-50 {
width: 50px;
}
td.td-width-100 {
width: 100px;
}
td.td-width-150 {
width: 150px;
}
</style>
</head>
<body>
<table class="gridtable">
<!-- cospan -->
<tr>
<td colspan="2">Info Header 1</td>
<td>Info Header 2</td>
</tr>
<tr>
<td class="td-width-50" title="Text 1A">Text 1A</td>
<td class="td-width-100">Text 1B</td>
<td class="td-width-150">Text 1C</td>
</tr>
<tr>
<td class="td-width-50">Text 2B</td>
<td class="td-width-100">Text 2B</td>
<td class="td-width-150">Text 2C</td>
</tr>
</table>
</body>
</html>