I am having an issue with the menu being extremely slow when I have
the following position set to static.
.sf-navbar li {
background: url('images/menu_tab.png') repeat-x;
height: 54px;
position: satic;
margin: 41px 1px 0 0;
padding: 8px 0 0 0;
border:1px solid red
}
It works fine in IE but not Firefox. Any suggestions.
Below is the rest of my CSS
/*** adding the class sf-navbar in addition to sf-menu creates an all-
horizontal nav-bar menu ***/
.sf-navbar {
background: none;
height: 2.5em;
padding-bottom: 2.5em;
position: relative;
padding-left: 251px;
}
.sf-navbar li {
background: url('images/menu_tab.png') repeat-x;
height: 54px;
position: relative;
margin: 41px 1px 0 0;
padding: 8px 0 0 0;
border:1px solid red
}
.sf-navbar a {
border-top: none;
display: block;
line-height: 34px;
margin-top: -10px;
}
.sf-navbar li li a {
line-height: 110%;
border:1px solid green
}
.sf-navbar li ul {
width: 44em; /*IE6 soils itself without this*/
}
.sf-navbar li li {
background: none;
position: static;
left: 1.5em; /*adjusts submenu left margin */
top: 41px; /*adjusts vertical spacing for submenu*/
margin: 8px auto 0 auto;
}
.sf-navbar li li ul {
width: 13em;
}
.sf-navbar li li li {
width: 100%;
}
.sf-navbar ul li {
width: auto;
float: left;
}
.sf-navbar a, .sf-navbar a:visited {
border: none;
color: #fff;
}
.sf-navbar li li a, .sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar
a:active, .sf-navbar li li a:visited {
color: #000;
}
#mainnav .sfHover a{color:#000;} /*fixes text change on hover when
hover is not directly over the text*/
.sf-navbar li.current {
background: pink;
}
.sf-navbar li:hover,
.sf-navbar li.sfHover,
.sf-navbar li li.current,
.sf-navbar a:focus,/*.sf-navbar a:hover,*/ .sf-navbar a:active {
background: url('images/menu_tab_selected.png') repeat-x;
}
#vids #mainnav .videos, #forum #mainnav .forums,
#group #mainnav .groups, #event #mainnav .events, #ads
#mainnav .classifieds{
background: url('images/menu_tab_selected.png') repeat-x;
}
#pics #mainnav .home {
background: url('images/menu_tab1_selected.png') repeat-x;
}
#pics #mainnav .home a, #vids #mainnav .videos a, #forum
#mainnav .forums a,
#group #mainnav .groups a, #event #mainnav .events a, #ads
#mainnav .classifieds a{
color: #000;
}
.sf-navbar #phover li.sfHover {
background: url('images/menu_tab1_selected.png') no-repeat
transparent;
}
.sf-navbar ul li:hover,
.sf-navbar ul li.sfHover,
ul.sf-navbar ul li:hover li,
ul.sf-navbar ul li.sfHover li,
.sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active {
background: none;
}
ul.sf-navbar li li li:hover,
ul.sf-navbar li li li.sfHover,
.sf-navbar li li.current li.current,
.sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar
ul li li a:active {
background: navy;
}
ul.sf-navbar .current ul,
ul.sf-navbar ul li:hover ul,
ul.sf-navbar ul li.sfHover ul {
left: 0;
top: 2.5em; /* match top ul list item height */
}
ul.sf-navbar .current ul ul {
top: -999em;
}
.sf-navbar li li.current > a {
font-weight: bold;
}
/*** point all arrows down ***/
/* point right for anchors in subs */
.sf-navbar ul .sf-sub-indicator { background-position: -10px -100px; }
.sf-navbar ul a > .sf-sub-indicator { background-position: 0 -100px; }
/* apply hovers to modern browsers */
.sf-navbar ul a:focus > .sf-sub-indicator,
.sf-navbar ul a:hover > .sf-sub-indicator,
.sf-navbar ul a:active > .sf-sub-indicator,
.sf-navbar ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li.sfHover > a > .sf-sub-indicator {
background-position: -10px -100px; /* arrow hovers for modern
browsers*/
}
/*** remove shadow on first submenu ***/
.sf-navbar > li > ul {
background: transparent;
padding: 0;
-moz-border-radius-bottomleft: 0;
-moz-border-radius-topright: 0;
-webkit-border-top-right-radius: 0;
-webkit-border-bottom-left-radius: 0;
}
/***********ADDED BY CREATESEAN *************/
#mainnav {
min-height: 95px;
background: url('images/logo1.jpg') no-repeat transparent;
font-variant: small-caps;
}
/***************first tab hover fix stuff**********************/
.sf-navbar .home {
background: url('images/menu_tab1.png') no-repeat transparent;
}
#mainnav .sf-navbar li.home:hover {
background: url('images/menu_tab1_selected.png') no-repeat
transparent;
}
#mainnav #subphotos li:hover {
background: none;
}
/****************end first tab hover fix stuff********************/
#mainnav .sf-navbar .end{
background: url('images/menu_end.png') no-repeat transparent right;
text-align: right;
min-width: 25px;
overflow: hidden;
padding: 0;
}
#mainnav .sf-navbar .end {
margin-right: 5px;
}
#navwrap {
min-height: 136px;
background: url('images/subnav.png') repeat-x bottom left;
border:1px solid;
}
#mainnav.sf-navbar ul ul {
margin-left: 1.5em;
}
.sf-menu li li a {
padding-right: 0.5em;
padding-left: 0;
}
.sf-menu li li a:focus, .sf-menu li li a:hover, .sf-menu li li
a:active{
text-decoration: underline;
}
