Just looked at the XHTML Strict tips on scriptandstyle.com, one of the latest posts, and tried setting up a web page with the nav bar at the top fixed no-scroll like the web site you are linked to for the article. Is position: fixed not supported by IE6/7 because I had to add <br /> to allow for space for my nav bar at the top of the screen, otherwise the following content will be overlaid by the nav bar? now in the example the nav bar is placed at the bottom of the screen, and I have not checked the css code yet for special IE provisions.
It looked like an interesting technique, so thought I would try it in a simple example.
the example is back http://www.stthomascurlingclub.com/new/new3.html
in my example, I have placed the navigation bar on top, followed by the header and then content on the page, trying to emulate the example I mentioned in the first post
the top navigation menu bar is fixed
for IE7, I had to add 3 <br /> in the HTML code to get the following content to show where it should, but this was not necessary for FF2. I have not tried it in IE6, other than in browsershots.org
is there any way to set the code up so that you do not need to specify the 3 <br />'s in the IE code or any other conditional statement for IE?
adding a margin-bottom to the nav bar will work in IE7 but adds a large space on the top in FF2. that is why I added the 3 br's and eliminated the margin-bottom. I guess I could try a conditional addition of the margin-bottom if IE, didn't try that yet.
in the CSS code, you will notice that I have a margin-bottom specified on id #content, this works in FF but not in IE7. the effect of it not working in IE is that the header is covered by the nav bar. to get around this, I added a conditional statement for IE that adds a line break to the code. this seems to work the way I want it to.
so adding a margin to the top of #content works in FF but not in IE7, why? I guess this is the question I would like an answer to. is there a better way to push the content down in IE7?
tried setting up a web page with the nav bar at the top fixed no-scroll like the web site
you are linked to for the article. Is position: fixed not supported by IE6/7 because I had
to add <br /> to allow for space for my nav bar at the top of the screen, otherwise the
following content will be overlaid by the nav bar? now in the example the nav bar is placed
at the bottom of the screen, and I have not checked the css code yet for special IE provisions.
It looked like an interesting technique, so thought I would try it in a simple example.
example: http://www.stthomascurlingclub.com/new/new3.html
Your site seems to be down at the moment
in my example, I have placed the navigation bar on top, followed by the header and then content on the page,
trying to emulate the example I mentioned in the first post
the top navigation menu bar is fixed
for IE7, I had to add 3 <br /> in the HTML code to get the following content to show where it should,
but this was not necessary for FF2. I have not tried it in IE6, other than in browsershots.org
is there any way to set the code up so that you do not need to specify the 3 <br />'s in the IE code
or any other conditional statement for IE?
adding a margin-bottom to the nav bar will work in IE7 but adds a large space on the top in FF2.
that is why I added the 3 br's and eliminated the margin-bottom. I guess I could try a conditional
addition of the margin-bottom if IE, didn't try that yet.
Al
so adding a margin to the top of #content works in FF but not in IE7, why? I guess this is the question I would like an answer to. is there a better way to push the content down in IE7?
Al
http://www.stthomascurlingclub.com/new/new3.html
HTML:
CSS