html t页面高度自动扩充,具有100%宽度的HTML表，Tbody内有垂直滚动

我在用display:block为thead和tbody..因为它的宽度thead列的宽度与tbody柱子。table {

margin:0 auto;

border-collapse:collapse;}thead {

background:#CCCCCC;

display:block}tbody {

height:10em;overflow-y:scroll;

display:block}

要解决这个问题，我用小的jQuery代码，但可以在JavaScript只有。var colNumber=3 //number of table columns    for (var i=0; i

var thWidth=$("#myTable").find("th:eq("+i+")").width();

var tdWidth=$("#myTable").find("td:eq("+i+")").width();

if (thWidth

$("#myTable").find("th:eq("+i+")").width(tdWidth);

else

$("#myTable").find("td:eq("+i+")").width(thWidth);           }

不适用于IE 8

var colNumber=3 //number of table columns

for (var i=0; i

{

var thWidth=$("#myTable").find("th:eq("+i+")").width();

var tdWidth=$("#myTable").find("td:eq("+i+")").width();

if (thWidth

$("#myTable").find("th:eq("+i+")").width(tdWidth);

else

$("#myTable").find("td:eq("+i+")").width(thWidth);

}

table {margin:0 auto; border-collapse:separate;}

thead {background:#CCCCCC;display:block}

tbody {height:10em;overflow-y:scroll;display:block}

A really Very Long Header TextNormal HeaderShort

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact

Text shorter than header

Text is longer than header

Exact