I'm getting some funny behavior in IE (fine in FF and Opera) with a table
(logtable) that is supposed to be 1000px wide within a div (log) that is
supposed to be 100% of it's parent container (stats) which is supposed to have
8% margin right and left.
What is happening is that the 8% margin on the right is being ignored. But as
soon as you try to resize your browser window (even the slightest adjustment)
the margin snaps to the correct dimension. Any suggestions? I'm wondering if
I'm using position:relative correctly, or have missed something else...
Here is the CSS (sorry, no link...)
body {
margin:0 0 0 0;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
}
#stats {
margin:0 8% 0 8%;
padding-bottom:30px;
}
#log {
position:relative;
top:0;
width:100%;
height:320px;
overflow:scroll;
margin-bottom:5px;
line-height:13px;
}
#logtable {
font-size:12px;
width:1000px;
border:0;
}
The table is dynamically generated like this:
<table id="logtable" cellspacing="1">
<colgroup>
<col width="180">
<col width="120">
<col width="150">
<col width="100">
<col width="150">
<col width="250">
</colgroup>
<tr>
<th align="left">Column 1</th>
<th align="left">Column 2</th>
<th align="left">Column 3</th>
<th align="left">Column 4</th>
<th align="left">Column 5</th>
<th align="left">Column 6</th>
</tr<?php
for ($i = 0; $i < $log_data; $i++)
{
$line = explode( "|", $data[$i] ); ?>
<tr>
<td align="left"><?php echo $line[0]; ?></td>
<td align="left"><?php echo $line[1]; ?></td>
<td align="left"><?php echo $line[2]; ?></td>
<td align="left"><?php echo $line[3]; ?></td>
<td align="left"><?php echo $line[4]; ?></td>
<td align="left"><?php echo $line[5]; ?></td>
</tr<?php
} ?>
</table>