HelP? Page doesn't look good in Firefox

Hello!
I am an novice, and really don't know much about making homepages, but I do try.
I have used Frontpage for a while, but has now tried to make a new site using Expression Web 2.0

The new page works as I wanted in Internet Explorer.
But the drop-down menu does not work properly in Firefox.
(The whole page is strange)
Can someone take a look and tell mw what to do?

The website is: http://www.kennel-kokopelli.com

(And pardon my bad english)

Try changing the Z-index and see if that helps it to display over the underlying content. I have never used Frontpage or the new Expression web, but from the looks of the code it shoots out, I wouldn't want to. I am trying to figure out how the masthead might be involved in your problem. Try the Z-index first though and see if it helps any.

I just thought of something after I PM'd you - what is with all the conditional code for IE6 and IE7? It is only concerning itself with </a> tags most of the time in the markup. If the css z-index idea didn't work, after you ensure you closed it:



Another thought....



I noticed the descendent selector might be interfering with the positioning since you declared only you .menu ul ul tag to be positioned absolute. Try That out and see if it helps.....hopefully someone else can give some better insight.

Thanks once again.
I now tried:

.menu ul li:hover ul{
visibility:visible;
z-index: 3;
}

But nothing changed, I'll try the other suggestion.

Ok. I now tried:

# /* hide the sub level links */
# .menu ul ul {
# visibility:hidden;
# position:absolute;
# z-index:3;
# width:139px;
# height:0;
# }
# /* make the sub level visible on hover list or link */
# .menu ul a:hover ul{
# visibility:visible;
# position:absolute;
# }
# .menu ul li:hover ul{
# visibility:visible;
# position:absolute;
# z-index:3
# }

But that didn't seem to help.
Could there be something else than the menu that f***k up the page?

Hmmm....



I am not sure what else would help. I noticed lots of conditional statements around anchor points but I wouldn't think that would be causing the problem. Maybe it's something concerning the css of your content where your dog picture is...hopefully someone can help out on this one.

I have a feeling using the tables as a means of drop down menus might be a problem since the elements in question are within the masthead DIV which has it's overflow set to hidden. You might try using some absolutely positioned divs as your drop down elements - Fireworks is what I use for these types of menus and it always seems to come out fine, but it generates tables within an absolutely positioned DIV.

Couldn't work the last one out, it only appeared like text on the page...

#content {
position: relative;

should be content {
position: relative;

Without # first in the style css file

This sorted out the green field, has to work more with the menu..

Travis Coats - THANK YOU!
It sorted out when I just found the right menu..

I am glad to see it is working, but by you changing the #content to content, you have basically nullified the css selector for your content DIV. The bacckground color disappeared. However, if that change affected the way your tables displayed then I would look over your content css code and see what exactly was causing it. You can still get it to look colorful without losing your menu drop-downs. I would play with the css a little and keep testing the page until you find the culprit.