Positioning a scrollbar in MSIE 1

[Billkamm]

Whenever a scrollbar appears in my DIV element it appears within the DIV element and does not expand the size of that element or place the scrollbar after the element.

For example if I have 500 pixel height on a DIV element and a horizontal scrollbar is 10 pixels (estimate) then when the horizontal scrollbar appears (I'm using overflow: auto) then I now only have 490 pixels of information displayed within the DIV tag and 10 pixels of the scrollbar.

If there a property to tell the scrollbar to appear below the DIV tag or have the DIV tag expand to 510 pixels to accomadate the scrollbar without writing javascript for every DIV tag I want a scrollbar on?

 

[vacunita]

That particular behavior is an IE bug. It is because of the way IE handles the box model.

http://www.webcredible.co.uk/user-friendly-resources/css/internet-explorer.shtml

In short IE takes the established width as a min-width that the object can have, and everything else, margins,borders, paddings,scrollbars etc.. is just a part of that width.


There is however a hack to make IE correctly render the box.

It deals with adding a rule to your CSS that IE can't see:

[red]this is for IE[/red]
div{
width:510px;
}
[blue]this is for every other browser[/blue]
html>body div{
width:500px;
}

You will then have a 510pixel box for ie that when it has a scrollbar it becomes 500px worth of actuall viewab;le area. all other borwsers render the div correctly and read a 500px width from the second rule that IE can't see.



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.