CSS股利宽度 - 内里的div ...宽度似乎在IE7

Question

为关闭到目前为止，我这样做编程方式使用VB.net/ASP.net：

<table cellspacing="0" cellpadding="4" border="0" style="border- 
      width:0px;width:100%;border-collapse:collapse;font-size:12px;"> 
    <tr> 
<td colspan="6"></td> 
     <td align="center" colspan="3" style="background-color:#F0D3D3;text- 
      decoration:underline;">SET</td> 
     <td colspan="2" style="background-color:#CFF5CE;"></td> 
     <td align="center" colspan="3" style="background-color:#BEE0F7;text- 
      decoration:underline;">REM</td> 
    </tr> 
    <tr> 
<th style="width:70px;">M</th> 
    <th style="width:70px;">PG</th> 
    <th style="width:70px;">PV</th> 
    <th style="width:70px;">PDD</th> 
    <th style="width:40px;">R</th> 
    <th style="width:55px;">I #</th> 
    <th style="background-color:#F0D3D3;width:70px;">P A</th> 
    <th style="background-color:#F0D3D3;width:70px;">U D</th> 
    <th style="background-color:#F0D3D3;width:70px;">B P</th> 
    <th style="background-color:#CFF5CE;width:70px;">P U</th> 
    <th style="background-color:#CFF5CE;width:70px;">D E</th> 
    <th style="background-color:#BEE0F7;width:70px;">P</th> 
    <th style="background-color:#BEE0F7;width:70px;">U D</th> 
    <th style="background-color:#BEE0F7;width:70px;">B P</th> 
    </tr> 
</table> 

<div style="width:100%;clear:both;text-align:left;margin:0;"> 
    <div style="width:375px;float:left;margin:0;display:block;"> 
    <img onclick="change(this.parent);" src="minus99.jpg" style="border-width:0px;" /> 
    <span style="font-weight:bold;font-size:16px;">Test Company</span> 
    </div> 
    <div style="background- 
     color:#F0D3D3;width:210px;float:left;margin:0;display:block;"></div> 
    <div style="background- 
     color:#CFF5CE;width:140px;float:left;margin:0;display:block;"></div> 
    <div style="background- 
     color:#BEE0F7;width:210px;float:right;padding:0;margin:0;display:block;"></div> 
</div> 

这应该给我四张DIVS在一个容器DIV内。下面是它的现身为：

alt text http://i44.tinypic.com/2i7wxg9.jpg

非内嵌块以上的正确块是从具有完全相同的宽度，因为我使用了div的那些表。没有任何CSS为它们添加像素，我不这么认为。我需要排列这些，我不知道我的问题在哪里。任何帮助，将不胜感激。

Answer 1

Width: 100%覆盖单个列的宽度。在你的桌子上，有13个<th>，每个桌子的宽度都是桌子宽度的1/13：th。 <th>上的width物业不会执行任何操作。您可以通过将display: inline-block添加到<th>来强制它，但我不想这样。

此外，你应该设置粉红色和绿色的divs到float: right为了消除白色inbetween绿色和蓝色（注意，但你必须改变你的代码中的div的顺序）。

此外，如果您想要呈现表格数据，我建议使用表格。

Answer 2

您是否在桌上put cellspacing="0" cellpadding="0"？如果不是，那可能是差异来自哪里。 或者可能是边框。

你可以包含表头吗？

Answer 3

您可以改用div会在colspan="[number]"，例如：

<table cellspacing="0" cellpadding="4" border="0" style="border-width:0px;width:100%;border-collapse:collapse;font-size:12px;"> 
<tr> 
    <td colspan="6"></td> 
    <td align="center" colspan="3" style="background-color:#F0D3D3;text-decoration:underline;">SET</td> 
    <td colspan="2" style="background-color:#CFF5CE;"></td> 
    <td align="center" colspan="3" style="background-color:#BEE0F7;text-decoration:underline;">REM</td> 
</tr> 
<tr> 
    <th style="width:70px;">M</th> 
    <th style="width:70px;">PG</th> 
    <th style="width:70px;">PV</th> 
    <th style="width:70px;">PDD</th> 
    <th style="width:40px;">R</th> 
    <th style="width:55px;">I #</th> 
    <th style="background-color:#F0D3D3;width:70px;">P A</th> 
    <th style="background-color:#F0D3D3;width:70px;">U D</th> 
    <th style="background-color:#F0D3D3;width:70px;">B P</th> 
    <th style="background-color:#CFF5CE;width:70px;">P U</th> 
    <th style="background-color:#CFF5CE;width:70px;">D E</th> 
    <th style="background-color:#BEE0F7;width:70px;">P</th> 
    <th style="background-color:#BEE0F7;width:70px;">U D</th> 
    <th style="background-color:#BEE0F7;width:70px;">B P</th> 
</tr> 
<tr> 
    <td colspan="6"> 
      <img onclick="change(this.parent);" src="minus99.jpg" style="border-width:0px;" /> 
      <span style="font-weight:bold;font-size:16px;">Test Company</span> 
    </td> 
    <td colspan="3" style="background-color:#F0D3D3;"></td> 
    <td colspan="2" style="background-color:#CFF5CE;"></td> 
    <td colspan="3" style="background-color:#BEE0F7;"></td> 
</tr> 
</table> 

希望我帮助你.. =）