飞天小筑

导航

ie7、ie8 下Table 中 td 列固定宽度 未按样式设定显示 曲线解决方案

 1 <!doctype html>
 2 <html>
 3 <head>
 4 <meta charset='utf-8'>
 5 <style>
 6 .title {background-color:#ccc;width: 150px}
 7 </style>
 8 </head>
 9 <body>
10 <table style='width:600px'>
11 <tr>
12 <td class='title'>哈哈</td>
13 <td>aa</td>
14 <td class='title'>大都市</td>
15 <td>bb</td>
16 </tr>
17 <tr>
18 <td class='title'>adad</td>
19 <td colspan='3'>alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉alkjd阿拉快的拉拉</td>
20 </tr>
21 </table>
22 </body>
23 </html>
View Code

 

此种情况下 在ie7、ie8下 第一行的 3列会被明显撑大,并未能按样式宽度(width: 150px) 显示

解决方案:

  1、写死每列宽度

  2、把 width:150px 修改成 width:20%  用百分比

 

posted on 2013-09-11 11:46  飞天小筑  阅读(1427)  评论(2编辑  收藏  举报