Hi. I am trying to change some of my page to CSS. The top of the page looks fine in IE but I have problems in Netscape 6.

1. My pink nav bar is lower in Netscape -- shouldn't the pixels be the same in every browser?

2. The #title is hanging way out the side beyond my screen.

My page:
http://www.thecozycactus.com/0-Template2.html

My CSS

Also, I am trying to position my corner images at the bottom, but it shows up at the bottom of my screen and not at the bottom of my page.

I would really appreciate any help or guidance. I have been reading through the Netscape fixes, but haven't found anything to work yet.

Thank you!! - Beth

Browsers add different margins and padding to lists. You have to control that. An easy way is to set everything to zero and then add back what you want.



But you have worse problems that have to do with your positioning scheme. Have you noticed that the content area eats up the nav bar if then text size is decreased? Don't position when there is no reason to. Blocks stack one under the other anyway. If you do position you have to make it in a way that takes things like that into account. Positioning an item in the middle of a page relative the top of the browser window isn't gonna work out well.

Thank you!! Setting the lists margin/padding to 0 helped a lot. After removing much of my "absolute positioning," I was able to rework my CSS and it seems to be working in both IE and NEtscape.

Thanks for sending me in the right direction.

There you go. Less is more. Save the fancy stuff for when it's really needed.