2011-12-16 32 views
3

我遇到了一些问题,需要某些样式表行为。我甚至不确定这是否可能。基本上我试图放置一个具有静态单元格宽度的可变数目的单元格的表格,其格式为overflow: auto,我的目标是当表格宽度超过容器DIV的宽度时,它将变为可滚动。防止溢出的表格:缩小的自动div

事实并非如此。细胞收缩在一起。一个非常基本的表示(与内嵌样式缓解这一点;没有实际的应用哈哈)代码:

<div style="width: 1000px; overflow-x: auto;"> 
    <table> 
     <tr> 
      <td style="width:400px;"> 
       This 
      </td> 
      <td style="width:400px;"> 
       Should 
      </td> 
      <td style="width:400px;"> 
       Scroll! 
      </td> 
     </tr> 
    </table> 
</div> 

反正我可以用CSS做到这一点,还是我将不得不回去通过计算在包含表格的第二个div上设置内联宽度?

谢谢!

回答

1

如果您在table本身上设置宽度,则适用。

<table style="width:1200px;">

td总是会收缩到所需的大小,他们不会把桌子宽在这种情况下。

+0

我就是这么说的。做得好。 +1 – 2011-12-16 21:59:19

0

使用CSS可以像下面那样完成,但是如果您有多个表或div,请确保使用id或class来应用css。

<style> 
    div { width: 400px; overflow-x: auto; } 
    table { width:1200px; } 
    table td { width:400px; } 
</style> 


<div> 
    <table> 
     <tr> 
      <td> 
       This 
      </td> 
      <td> 
       Should 
      </td> 
      <td> 
       Scroll! 
      </td> 
     </tr> 
    </table> 
</div>