适用于使用colspan的IE8中固定表格布局的CSS

时间：2013-04-18 16:10:52

标签： html html-table internet-explorer-8

这是动态构建的表的一个例外。什么是使第二个rwo（id ='backdate'）中的第一个<td>具有固定宽度的正确CSS？ （当前在增加或减少70值时不会改变宽度）

enter image description here 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
 <table class='fifo' width='850' style='width:850px;table-layout:fixed;'>
  <thead><tr>
   <th colspan='3' style='width:820px;'>Details</th>
   <th style='cursor:pointer;width:15px;' title='Click to save.'><span class='ui-icon ui-icon-check'/></th>
   <th style='width:15px;' title='Click to close.'><span class='ui-icon ui-icon-closethick'/></th>
  </tr></thead>
  <tbody>
   <tr><td id='BACKDATE' colspan='1' class='button' style='cursor:pointer;width:70px;' width='70' title='Back Date Start Date/time.'>Back Date</td>
   <td colspan='4' style='width:780px;' width='780'><b>Start Date: </b></td></tr>
  </tbody>
 </table>
</body>
</html>

FIDDLE WITH SOLUTION...

1 个答案:

答案 0 :(得分：0)

添加一个虚拟行，其宽度与浏览器“显示”相同，但未见到可以解决问题。为了摆脱额外的边界，我不得不将border-top-width:0px;添加到表style。

的 HTML 的

<tr>
  <th class='test' style='width:80px;'/>
  <th class='test' style='width:560px;'/>
  <th class='test' style='width:150px;'/>
  <th class='test' style='width:15px;'/>
  <th class='test' style='width:15px;'/>

的 CSS 的

.test {
  padding:0px!important;
  border-width:0px!important;
  height:0px!important;
}
相关问题
最新问题