overflow:auto problem on IE

I would appreciate if somebody explained to me:

a) why the following HTML correctly handles overflow in FireFox but
does not in IE
b) how that can be fixed.

In FF when the browser window is resized so div d2 doesn't fit in d1,
d2 gets a horizontal scrollbar. In IE div d1 is resized to fit d2.

<body >
<table width="100%" border=1>
<tr>
<td>
<div id="d1" width="100%" style="border:1px solid red">
<div id="d2" style="overflow:auto;">
<table >
<tr>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
</tr>
</table>
</div>
</div>
</td>
</tr>
</table>
</body>

Thanks in advance

"Misha Bergal" <misha.bergal.noreply@gmail.com> wrote in message
news:1112167610.902506.7710@z14g2000cwz.googlegrou ps.com...[color=blue]
> I would appreciate if somebody explained to me:
>
> a) why the following HTML correctly handles overflow in FireFox but
> does not in IE[/color]

I don't use FF so no joy there.
[color=blue]
> b) how that can be fixed.[/color]

See below:
Good Luck,
me

<table width="100%" border=1>
<tr>
<td>
<div id="d1" width="100%" style="border:1px solid red">
<div id="d2" style="position:relative; width:200px; height:115px; z-index:1;
overflow: auto">
<table>
<tr>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
<td>sssssssssssssss</td>
</tr>
</table>
</div>
</div>
</td>
</tr>
</table>

me wrote:[color=blue]
> "Misha Bergal" <misha.bergal.noreply@gmail.com> wrote in message
> news:1112167610.902506.7710@z14g2000cwz.googlegrou ps.com...[color=green]
> > I would appreciate if somebody explained to me:
> >
> > a) why the following HTML correctly handles overflow in FireFox but
> > does not in IE[/color]
>[/color]
[...]
[color=blue]
> See below:
> Good Luck,
> me
>
> <table width="100%" border=1>
> <tr>
> <td>
> <div id="d1" width="100%" style="border:1px solid red">
> <div id="d2" style="position:relative; width:200px; height:115px;[/color]
z-index:1;[color=blue]
> overflow: auto">[/color]

I need d2 to be width="100%", so it resizes with the document.
Specifying fixed width is not an acceptable solution for me :-(.
[color=blue]
> <table>
> <tr>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> <td>sssssssssssssss</td>
> </tr>
> </table>
> </div>
> </div>
> </td>
> </tr>
> </table>[/color]

overflow:auto problem on IE

Post your reply

Question stats

Most Active

Most Questions Answered

Top Questions

Latest Questions

Similar topics

More