Forums

CSS

This topic is locked

Horizontal scrolling DIV in IE5.x Mac

Posted 21 Feb 2006 07:40:54
1
has voted
21 Feb 2006 07:40:54 jimbo jones posted:
A website I am creating requires that a collection of thumnail images be displayed in a section of the page which will allow users to scroll horizontally through them. I wish to avoid using frames for this.

My solution was to create a div with a fixed with and set the overflow-x property to auto in order to enable the horizontal scrolling. Inside this I put a wide table of thumbnail images which expands horizontally adding each image to its own <td> for as many images that exist in the database.

While this works very nicely on IE6, FF, Opera 8.51 Safari 1/2.x etc, I am having real trouble trying to make it work on IE5.x for Mac. It seems as though the browser ignores the fixed width of the div and it expands to the width of all of the content within the div, falling to the bottom of the page.

Thinking that this might have been a problem with having a very wide table within the div, I temporarily replaced the table with just the images themselves and set the white-space property to nowrap in order to make them line up horizontally. This did not fix the problem.

The CSS for the div is

div.horizScroller {
float:right;
height:100px;
width:607px;
overflow:scroll;
overflow-y:hidden;
background-color:#FFFFFF;
text-align:left;
margin-top:0px;
}

If anyone would like to see the site please do so at: www.redartaustralia.com.au/20060221/index.php.

Any help / suggestions would be greatly appreciated.

Thanks.

Reply to this topic