2 replies [Last post]
mille142
mille142's picture
User offline. Last seen 3 years 12 weeks ago. Offline
newbie
Joined: 2008-11-02
Posts: 8
Points: 0

When i display this website in IE7 it works perfect and when i display it in FIREFOX the menu is spaced down 20-25px.

CSS STYLESHEET CODE FOR MENU AND HEADER

body,html {
margin: 0 0 0 0;
padding: 0 0 0 0;
height: 100%;
width: 100%;
background-color: #ffffff;
background-image: url(images/main.gif);
background-repeat: repeat-x;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
}

#page {
width: 750px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
}

#page-header {
width: 670px;
height: 85px;
padding: 20px 40px 0px 40px;
background-image: url(images/header.gif);
line-height: 85px;
font-size:28px;
}
#page-header2 {
width: 660px;
height: 175px;
padding: 0px 40px 0px 40px;
background-image: url(images/header2.gif);

}

#menu {

height:20px;
position:relative;
z-index:100;
font-family:arial, sans-serif;}

* html .menu {width:670px; width:670px;}
.menu ul {padding: 0px 0px 0px 0px; margin:0px; list-style-type:none; float:left;}
.menu ul ul {width:109px;}
.menu li {float:left;width:109px;position:relative;}
.menu a, .menu a:visited {
display:block;
font-size:11px;
text-decoration: none;
color:#fff;
width:100px;
height:20px;
border:1px solid #fff;
border-width:1px 0 1px 1px;
background:#000;
padding-left:24px; line-height:20px; font-weight:bold;}

* html .menu a, * html .menu a:visited {width:149px; width:138px;}
* html .menu ul ul {top:30px;top:31px;}
* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;width:128px;}

/*Drop Class */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#d4d8bd 130px center;}
.menu ul ul a.drop:hover{background:#c9ba65;}
.menu ul ul :hover > a.drop {background:red 130px center;}
.menu ul ul {visibility:hidden;position:absolute;height:0;top:20px;left:0; width:149px;border-top:1px solid #000;}

.menu table {position:absolute; top:0; left:0; border-collapse:collapse;}

.menu a:hover, .menu ul ul a:hover{color:#000; background:red;}
.menu .menu ul ul :hover > a {color:#000; background:red;}

.menu ul ul a, .menu ul ul a:visited {color:#000; height:auto; line-height:1em; padding:5px 10px; width:128px;border-width:0 1px 1px 1px;}

.menu ul ul ul{left:149px; top:-1px; width:149px;}

.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }
.menu ul :hover ul ul{visibility:hidden;}
.menu ul :hover ul :hover ul{ visibility:visible;}
}

CODE FOR BODY OF DOCUMENT

  • Contact
  • Business picture

    Singh336
    Singh336's picture
    User offline. Last seen 1 year 45 weeks ago. Offline
    rank Regular
    Regular
    Timezone: GMT-4
    Joined: 2006-12-13
    Posts: 23
    Points: 6

    i was doing a layout

    i was doing a layout earlier...

    and I had a menu as well..

    and there was SPACING in the damn menu in firefox... but in IE it was perfect !

    I couldnt figure it out for liek 5 minutes, then i realized, I moved some class's from my html to my css, and didnt save the CSS, so firefox couldnt find the values for the divs, and they were spaced out, and IE just assumed to place them in relative position...

    idk if thats your case i dont have time to read all that, but yea Smile

    mille142
    mille142's picture
    User offline. Last seen 3 years 12 weeks ago. Offline
    newbie
    Joined: 2008-11-02
    Posts: 8
    Points: 0

    My CSS has been saved and i

    My CSS has been saved and i have all the classes defined there Sad Thanks Though