div streched when table is too wide

want table scroll inside of the div

[mongoloid001]

Hi, I have a div element surrounding a very wide table. But I cannot seem to get the div to contain the table so to have a nice scroll bar at the bottom. The table always wins. Any help?

<div style="position:relative; width:600; height:60; overflowX:scroll;">
<table class="table" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>Number</th>
<th>Area</th>
<th>Date</th>
<th>Blah</th>
<th>Area</th>
<th>Type</th>
<th>Code</th>
<th>Blah</th>
<th>Code</th>
<th>Code</th>
<th>Code</th>
<th>Depth</th>
<th>Blah</th>
<th>Blah</th>
<th>Code</th>
<th>System</th>
<th>Tactic</th>
<th>Condition</th>
<th>Equipment</th>
<th>Blah</th>
<th>Blah</th>
<th>Blah</th>
<th>Project</th>
<th>Contract</th>
<th>Actual</th>
<th>Cost</th>
<th>Total</th>
</tr>
</table>
</div>

[Purple Martin]

Try overflow instead of overflowX.

[SuzyUK]

and
put explicit measurements on the div measurements otherwise it wont know .. 600 could be ems, %, px, pt... etc

e.g.

<div style="position:relative; width:600px; height:60px; overflow:scroll;">

Suzy

[mongoloid001]

ok, i used both overflowX and overflowY in the style and it worked. overflow works too except the vertical scroll bar showing up all the time.

Thanks!

[aevea]

overflowx and overflowy will only work in internet explorer. If you want other browsers to handle it, try

overflow:auto;

Adam