Hi there,
I am new here on this site… I got a problem with a menu working fine in ie7 but breaking up in Firefox… this is my first CSS website so I would call me begginer level and I have tried to find all the problems in here but I just cant find it. I am sure it is something very simple I missed… But I feel I cant do this my self and go to the experts on this forum and ask if any one know what to do.
.nav {
height:20px;
position:relative;
font-family:arial, verdana, sans-serif;
font-size:11px;
width:1200px;
z-index:500;
}
.nav li
{
display:block;
float:left;
margin:0 -20px -1px 0;
}
.nav .table {
display:table;
margin:0 auto;
}
.nav .select,
.nav .current {
margin:0;
padding:0 -20px -1px 0;
list-style:none;
display:table-cell;
white-space:nowrap;
}
.nav .select a {
display:block;
height:35px;
float:left;
background: url(../Images/Menu/transperent.gif);
padding:0 -20px -1px 0;
text-decoration:none;
line-height:20px;
white-space:nowrap;
color:#ddd;
}
.nav .current a {
display:block;
height:35px;
float:left;
background: url(../Images/Menu/transperent.gif);
padding:0 -20px -1px 0;
text-decoration:none;
line-height:20px;
white-space:nowrap;
color:#fff;
}
.nav .current a b {
display:block;
padding:0 -20px 0 -20px;
}
.nav .select a:hover,
.nav .select li:hover
.nav .select li li:hover a {
padding:0 -20 0 -20px;
cursor:pointer;
color:#fff;
}
.nav .select a:hover b,
.nav .select li:hover a b
.nav .select li li:hover {
display:block;
float:left;
padding:0 -20px 0 -20px;
background:url(../Images/Menu/transperent.gif) right top;
cursor:hand;
}
.nav .select_sub {
display:none;
}
/* Bilder för menyn */
.nav li a b.p1
{
display:block;
width:20px;
height:19px;
background:url(../Images/Menu/l_dgreen_tm.png);
float:left;
}
.nav li a b.p2
{
display:block;
height:19px;
padding:0 0px;
background:url(../Images/Menu/m_dgreen_tm.png) repeat-x;
float:left;
text-align:center;
line-height:18px;
color:#000;
font-weight:normal;
font-family:verdana;
font-size:11px;
}
.nav li a b.p3
{
display:block;
width:20px;
height:19px;
background:url(../Images/Menu/r_dgreen_tm.png);
float:left;
position:relative;
z-index:100;
}
.nav li a:hover, .nav li a:focus
{
border:0;
z-index:600;
}
.nav li a:hover b.p1, .nav li a:focus b.p1
{
position:relative;
z-index:100;
background:url(../Images/Menu/l_lgreen_tm.png);
cursor:pointer;
}
.nav li a:hover b.p2, .nav li a:focus b.p2
{
position:relative;
z-index:100;
background:url(../Images/Menu/m_lgreen_tm.png) repeat-x;
color:#040;
cursor:pointer;
}
.nav li a:hover b.p3, .nav li a:focus b.p3
{
position:relative;
z-index:100;
background:url(../Images/Menu/r_lgreen_tm.png);
cursor:pointer;
}
.nav li a.current
{
border:0;
z-index:1000;
}
.nav li a.current b.p1, .nav li a:hover.current b.p1, .nav li a:active.current b.p1
{
position:relative;
z-index:100;
background:url(../Images/Menu/l_black_tm.png);
cursor:default;
}
.nav li a.current b.p2, .nav li a:hover.current b.p2, .nav li a:active.current b.p2
{
position:relative;
z-index:100;
background:url(../Images/Menu/m_black_tm.png) repeat-x;
color:#fff;
cursor:default;
}
.nav li a.current b.p3, .nav li a:hover.current b.p3, .nav li a:active.current b.p3
{
position:relative;
z-index:100;
background:url(../Images/Menu/r_black_tm.png);
cursor:default;
}
/* bilder till submeny */
.nav li li a b.p1
{
display:block;
width:20px;
height:19px;
background:url(../Images/Menu/l_lgreen_tm.png);
float:left;
}
.nav li li a b.p2
{
display:block;
height:19px;
padding:0 0px;
background:url(../Images/Menu/m_lgreen_tm.png) repeat-x;
float:left;
text-align:center;
line-height:18px;
color:#000;
font-weight:normal;
font-family:verdana;
font-size:11px;
}
.nav li li a b.p3
{
display:block;
width:20px;
height:19px;
background:url(../Images/Menu/r_lgreen_tm.png);
float:left;
position:relative;
z-index:100;
}
.nav li li a:hover, .nav li li a:focus, .nav li li a:active
{
border:0;
z-index:700;
}
.nav li li a:hover b.p1, .nav li li a:focus b.p1, .nav li li a:active b.p1
{
position:relative;
z-index:100;
background:url(../Images/Menu/l_dgreen_tm.png);
cursor:pointer;
}
.nav li li a:hover b.p2, .nav li li a:focus b.p2, .nav li li a:active b.p2
{
position:relative;
z-index:100;
background:url(../Images/Menu/m_dgreen_tm.png) repeat-x;
color:#040;
cursor:pointer;
}
.nav li li a:hover b.p3, .nav li li a:focus b.p3, .nav li li a:active b.p3
{
position:relative;
z-index:100;
background:url(../Images/Menu/r_dgreen_tm.png);
cursor:pointer;
}
.nav li li a.selected
{
z-index:800;
}
.nav li li a.selected b.p1, .nav li li a:hover.selected b.p1, .nav li li a:active.selected b.p1
{
position:relative;
z-index:200;
background:url(../Images/Menu/l_black_tm.png);
cursor:default;
}
.nav li li a.selected b.p2, .nav li li a:hover.selected b.p2, .nav li li a:active.selected b.p2
{
position:relative; z-index:200;
background:url(../Images/Menu/m_black_tm.png) repeat-x;
color:#fff;
cursor:default;
}
.nav li li a.selected b.p3, .nav li li a:hover.selected b.p3, .nav li li a:active.selected b.p3
{
position:relative;
z-index:200;
background:url(../Images/Menu/r_black_tm.png);
cursor:default;
}
Hope some one got an ide, se the menu http://www.spelbiblioteket.se