Help! Stop DIV tag moving when scrolling |
Help! Stop DIV tag moving when scrolling |
rjh |
Jan 26 2008, 01:53 PM
Post
#1
|
Group: Members Posts: 4 Joined: 24-January 08 Member No.: 4,780 |
Hi,
I'm currently developing a website and am having issues with div tags. When the contents of a page are greater than the screen resolution and the user has to scroll down the page, the container div tag moves down with it. I need the container div to stay at the top of the page where i have coded iteven when scrolling. This issue only occurs in Internet Explorer and not in Firefox, Opera, Safari of any other browsers i have tested. The container div has "relative" positioning and i have 2+ divs inside that, with "absolute" positioning so they stay enclosed in the container. Below is an example of the html code and CSS, any help i can get in resolving this issue would be greatly appreciated. CODE /* General CSS */ html {height: 100%;} body {margin: 0px; padding: 0px; height: 100%; background-color:#F5F5F5; font-family: Tahoma; font-size:11px; color:#000000;} form {margin: 0px; padding:0px;} hr {border: 0; width: 60%; color: #E4C7AC; background-color: #E4C7AC; height: 2px;} /* HTML Code */ <div style="position:relative; z-index: 0;"> <div style="position:absolute; top:0px; left:0px; z-index: -1;"><img src="images/star2.png" border="0" width="100" height="90" alt="" /></div> <div style="position:absolute; bottom:-5px; right:-5px; z-index: -1;"><img src="images/contactpage.png" border="0" width="200" height="200" alt="" /></div> ADDITIONAL CONTENT </div> |
rjh |
Jan 26 2008, 04:21 PM
Post
#2
|
Group: Members Posts: 4 Joined: 24-January 08 Member No.: 4,780 |
I have fixed this issue after almost a week of trying,
Someone told me to add "overflow-y: auto;" for the body style in the CSS to fix any scrolling issues. I removed this and it works in IE now. There are no scrolling issues anyway, can comeone explain why you would add this? Thanks. |
Christian J |
Jan 27 2008, 01:48 PM
Post
#3
|
. Group: WDG Moderators Posts: 9,649 Joined: 10-August 06 Member No.: 7 |
can comeone explain why you would add this? In IE you always get a vertical scrollbar outlined, even when scrolling isn't necessary. Adding "overflow: auto" makes that go away so it behaves more like other browsers ("overflow-y: auto" should do the same thing). But you should also use an HTML selector to make sure it works with a std mode Doctype: CODE html, body {overflow: auto;} |
Frederiek |
Jan 27 2008, 03:37 PM
Post
#4
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
FYI, "overflow-y: auto" actually adds the vertical scrollbar space in Safari 3/Mac.
See this sample page I found today: http://www.dave-woods.co.uk/wp-content/upl...-text-wrap.html. |
Lo-Fi Version | Time is now: 16th April 2024 - 10:38 PM |