Hi All,
I am currently working on this site:
http://www.manisheriar.com/willen/home.htm - xhtml and css validate.
Initially I had it so that the logo, main image on the left, and links all
scrolled with the content. However, I recently started playing around with
the idea of these elements being fixed and only the content scrolling.
Since IE doesn’t support fixed elements I have ended up with this in my css
for the 3 elements in question (using the !important declaration to feed
different values to Moz and IE):
body { /* -- keeps the William Lenihan logo fixed for Moz browsers /
scrolling for IE -- */
background:#000;
text-align:center;
font:normal 1em/1.3em "Times New Roman",Times,serif;
background:#000 url(../images/willen.gif) no-repeat top left;
background-attachment:fixed !important;
background-attachment:scroll;
}
#leftCol { /* -- keeps the main image on left fixed for Moz browsers /
IE ignores this -- */
float:left;
width:200px;
height:601px;
background:url(../images/street.jpg) no-repeat top left;
position:fixed;
}
#nav { /* -- keeps nav buttons on right fixed for Moz browsers /
floats the nav buttons right for IE -- */
position:fixed !important;
position:relative;
float:none !important;
float:right;
right:7.5% !important;
right:auto;
text-align:left;
}
Ok, so everything is working great - The entire page scrolls in IE and only
the content scrolls in moz ... just like I wanted! EXCEPT: If I resize my
moz browser window to 800x600 then I cannot see all of the nav buttons ...
the bottom ones get cut off. And I cannot scroll to see the rest since the
content is "fixed."
I would strongly prefer not to have to decrease the height of the nav
buttons - I really like the square presentation. Ideally, I would really
like to keep the fixed content, but be able to scroll when necessary to see
the entirety of the nav buttons when the browser window is small. Any
suggestions?
Thanks in advance!!!!!
Mani Sheriar
Sheriar Designs | www.ManiSheriar.com
925.952.4365 (landline) | 925.914.0741 (cell)
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
