Hej!
Jag har en vertikal css meny som jag har två problem med. I netscape visas ej borden.
I ie7 hoppas raden upp en rad över första raden och hela menyn blir fel
Jag har ändrat margin top. Men då blir det fel i ff och netscape.
Visning kan ni se här.
Om ni jämför ie 7 och ie6 ser ni skillnaden. samt ff och netscape
http://www.ninasmat.se/hjalp/
Menyn scriptet
Kod:
<div id="menu_v">
<!--[if lte IE 6]><a href="#"><table cellpadding="0" cellspacing="0"><tr><td><![endif]-->
<ul>
<li><a href="#" class="head">Rubrik 1</a>
<ul>
<li><a href="#">länk 1</a></li>
<li><a href="#">länk 2</a></li>
<li><a href="#">länk 3</a></li>
</ul>
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<!--[if lte IE 6]><a href="#"><table cellpadding="0" cellspacing="0"><tr><td><![endif]-->
<ul>
<li><a href="#" class="head">Rubrik 2</a>
<ul>
<li><a href="#">länk 1</a></li>
<li><a href="#">länk 2</a></li>
<li><a href="#">länk 3</a></li>
</ul>
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<!--[if lte IE 6]><a href="#"><table cellpadding="0" cellspacing="0"><tr><td><![endif]-->
<ul>
<li><a href="#" class="head">Rubrik 3</a>
<ul>
<li><a href="#">länk 1</a></li>
<li><a href="#">länk 2</a></li>
<li><a href="#">länk 3</a></li>
</ul>
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<!--[if lte IE 6]><a href="#"><table cellpadding="0" cellspacing="0"><tr><td><![endif]-->
<ul>
<li><a href="#" class="head">Rubrik 4</a>
<ul>
<li><a href="#">länk 1</a></li>
<li><a href="#">länk 2</a></li>
<li><a href="#">länk 3</a></li>
</ul>
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<!--[if lte IE 6]><a href="#"><table cellpadding="0" cellspacing="0"><tr><td><![endif]-->
<ul>
<li><a href="#" class="head">Rubrik 5</a>
<ul>
<li><a href="#">länk 1</a></li>
<li><a href="#">länk 2</a></li>
<li><a href="#">länk 3</a></li>
</ul>
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</div>
css scriptet
Kod:
#menu_v {
position:absolute;
left: 5px;
top: 162px;
z-index: 2;
height: 106px;
width: 171px;
}
#menu_v table { line-height:0px; }
#menu_v ul { list-style:none; margin:0; padding:0; display:block; }
#menu_v li { border:1px solid #000000; position:relative; margin-bottom:-1px; }
#menu_v ul ul { display:none; position:absolute; left: 169px; margin-top:-21px; }
#menu_v .head { font-weight: bold; }
#menu_v .group { margin-right:-25px; margin-left:-5px; }
#menu_v ul table { width:10px }
#menu_v .group li a { position:relative; left:-10px; padding:0; }
#menu_v a { font:11px/20px Verdana, Arial, Helvetica, sans-serif; color:#000000; text-decoration:none; background-color: #fafafa; display:block; }
#menu_v ul a {
width:163px;
padding-left:5px;
position:relative;
}
#menu_v li:hover a, #menu_v a:hover a { color:#000000; background-color:#ddd; }
#menu_v li:hover ul, #menu_v a:hover, #menu_v a:hover ul { display:block; color:#000000; background-color:#ddd; }
#menu_v li:hover ul a, #menu_v a:hover ul ul a { color:#000000; background-color: #fafafa; }
#menu_v li:hover ul a:hover, #menu_v a:hover ul ul a:hover { color:#000000; background-color: #ddd; }
#menu_v a:active ul a, #menu_v a:focus ul a { color:#000000; background-color:#ffc63d; }
#menu_v ul li ul a:active, #menu_v ul li ul a:focus { color:#000000; background-color:#ffc63d; }
Jag har sökt men ej hittat nåt som kan fixa detta.
Hoppas nån vänlig kan hjälpa mig?
Tack på förhand
Med vänliga hälsningar
David