Site Revamp

So, (thanks again for all the kind help) we bit the bullet, and Jennifer and I had a bash at using CSS navigation on her website.

We changed it around to suit what we though looked decent with the current site design, and substituted it for the old, image-based navigation.

All went well, and the two new pages were duly launched, when -- scream, horror!!!!  -- we checked them out in Netscape Nav 7.1 and found that the new navigation text has shifted out of its table column and partly overwrites the main body text!

We checked the pages using IE6 and everything looks fine...   Is this just a problem with Navigator?

We've plummetted from cautiously triumphant to desperately depressed.   Our first foray into CSS has proved to be a quagmire... or has it?

Please let me know how the new pages work in your various browsers.   And if anyone knows a fix that'll make them work properly in Netscape, we'd be tremendously grateful.

The new pages are:

http://www.algarve-beach-life.com/algarve-apartments.html

and

http://www.algarve-beach-life.com/loule.html


The current, image-based nav is on the index page:


http://www.algarve-beach-life.com/

Thanks in advance for any pointers.    I may just have to reach for the sherry decanter while I wait...  

PS We did validate the pages before we put them up (using 1stPage2000).



Edited by sarab

Looks pretty good to me. the only things you might want to check out are dieplay:block - some versions of IE and NS did this poorly or not at all. Don't know about NS7.1.

Also, in the css, noted you referenced ID's of active and current for the first li and it's anchor tag. not sure what you're doing there as the ID' weren't defined in the css. In the html, you only referenced the  active, not the current id.

You may be inteested in this page on browser stats:
http://www.w3schools.com/browsers/browsers_stats.asp

Thanks for the suggestion, dpyers.   We'll run that one up the flagpole, as they say.

We did get a 'fix' of sorts, but it was a BIG compromise, and it isn't uploaded yet onto those pages.   In brief, if we reset the nav column's left margin to -30 px and increase its width by 30px (to 165px) then the nav text will appear in the column.   But we can only get it to look the same in IE and Netscape if we right-align it and pad it 10px away from the right edge.

Not much of a victory...    But why does that weird 30px offset to the right appear in Netscape and Mozilla browsers?   There doesn't seem to be anything in the CSS that would do it.    And the previous image-based navigation (which was HTML only) looks nicely centred on all the other uploaded pages for the site.

For the moment I remain the utterly confused

sarab  

About out of straws to grasp. You might want to try posting the problem to news:comp.infosystems.www.authoring.stylesheets or to news:netscape.public.dev.css