展開一個div寬度的兄弟表的寬度有很多行，並導致垂直滾動

我有一個表，它有很多列，因此導致垂直滾動。如何讓表格的分區兄弟擴展到該表格的整個寬度。展開一個div寬度的兄弟表的寬度有很多行，並導致垂直滾動

 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<body> 
    <div style='background: green'> 
    foobarbaz 
    </div> 
    <table> 
    <tr> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
     <td style='background: red'>foobarbazfoobarbazfoobarbazfoobarbaz</td> 
    </tr> 
    </table> 
</body> 
</html>

正如你在這裏看到的，div的寬度只等於body的寬度。我需要div寬度來匹配溢出表的寬度。

感謝

來源

2011-04-28 Akshay Rawat

難道你的意思是說「列」，而不是「行」和「水平」，而不是「垂直」？ – BalusC 2011-04-28 13:59:57

是的，謝謝，列不是行。更新 – 2011-04-28 14:02:25

水平是從左到右，垂直是從上到下。 – BalusC 2011-04-28 14:03:00

你可以用這兩個在另一個div的div和table，並給這個div要麼float: left或display: inline-block：

<div style="float: left"> 
    <div style='background: green'> foobarbaz </div> 
    <table> 
    .. 
    </table> 
</div>

您的原代碼：http://jsfiddle.net/9yKPT/
修正了float: left：http://jsfiddle.net/9yKPT/1/
修正了display: inline-block：http://jsfiddle.net/9yKPT/2/

來源

2011-04-28 14:02:24 thirtydot

CSS：一個ID添加到DIV和表，然後執行：

var w = setInterval(function() { 
    var $div = document.getElementById("divID").style.width; 
    document.getElementById("tableID").style.width = $div; 
},1);

來源

2011-04-28 14:01:49 John

展開一個div寬度的兄弟表的寬度有很多行，並導致垂直滾動

回答

相關問題