fragmente

A few days ago – i found a funny behavior in IE6. Our lovely Browser has problems with the CSS tag overflow: auto;

Story: I needed a small scroll-window in my contentarea, so i decided to use a <div> with a special scroll class (#littlescrollwindow). Inside the scroll <div> i wrote some unordered lists like  <ul><li>Test1</li></ul> and some dummy text.

Action: The Internet Explorer show me the right scrollbar and the content, but when i started scrolling – only the dummy text begins to scroll, but the listitems (<ul> + <li>) stands still and fixed in my little “scroll-window”.  The hole dummy text went over and through my listitems … nice view -> test it yourself.

Happy end: But the secret i want to write about  is … you have to position your little scroll-window !!! Thats all.

example:

#littlescrollwindow {
position: relative;
height:200px;
overflow: auto;
}

Summary: With this “bugfix” you can scroll ALL contentelements in IE6 without funny textgames.

Martin

Related posts:

1. How to use position-absolute and z-index with Internet Explorer 7 and nested containers
2. fight Internet Explorer 6 – reloaded