Buongiorno a tutti.
Chiedo il vostro aiuto per risolvere un problema di compatibilità css/browser .
Navigando qui e li sono riuscita a realizzare un menu in verticale, con relativa apertura di sottomenu al passaggio del mouse.
Ora però mi sono resa conto di 2 problemi :
1 – su IE6 ------ Non riesco a centrare verticalmente le immagini e il testo (cosa che avviene regolarmente su IE7)
2 – su IE7 ------ Non sempre le immagini contenute nel tag <a href …. <img src= spariscono (come vorrei che accadesse).
allego di seguito il codice che utilizzo con il relativo foglio di stile NELLA SPERANZA CHE qualche geniaccio in CSS mi possa aiutare.
Grazie
Vi prego () ….. mi serve un aiuto nel minor tempo possibile
codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Documento senza titolo</title> <style type="text/css"> /* Root = Vertical, Secondary = Vertical */ ul#navmenu, ul#navmenu li, ul#navmenu ul { margin: 0; border: 0 none; padding: 0; width: 230px; /*For KHTML*/ list-style: none; } ul#navmenu:after /*From IE 7 lack of compliance*/{ clear: both; display: block; font: 1px/0px serif; content: "."; height: 0; visibility: hidden; } ul#navmenu li { float: left; /*For IE 7 lack of compliance*/ display: block !important; /*For GOOD browsers*/ display: inline; /*For IE*/ position: relative; } /* Root Menu */ ul#navmenu a { border-bottom-color: #999; padding: 0 6px; display: block; background: #FFF; color: #06C; font: 14px/30px Verdana, Arial, Helvetica, sans-serif; text-decoration: none; height: auto !important; height: 30px; /* height: 1%; /*For IE*/ border-bottom-width: 2px; border-bottom-style: dotted; } /* Root Menu Hover Persistence */ ul#navmenu a:hover, ul#navmenu li:hover a, ul#navmenu li.iehover a { background: #F9F9F9; color: #900; } /* 2nd Menu */ ul#navmenu li:hover li a, ul#navmenu li.iehover li a { background: #FFF; color: #06C; } /* 2nd Menu Hover Persistence */ ul#navmenu li:hover li a:hover, ul#navmenu li:hover li:hover a, ul#navmenu li.iehover li a:hover, ul#navmenu li.iehover li.iehover a { background: #F9F9F9; color: #900; } /* 3rd Menu */ ul#navmenu li:hover li:hover li a, ul#navmenu li.iehover li.iehover li a { background: #FFF; color: #06C; } /* 3rd Menu Hover Persistence */ ul#navmenu li:hover li:hover li a:hover, ul#navmenu li:hover li:hover li:hover a, ul#navmenu li.iehover li.iehover li a:hover, ul#navmenu li.iehover li.iehover li.iehover a { background: #F9F9F9; color: #900; } /* 4th Menu */ ul#navmenu li:hover li:hover li:hover li a, ul#navmenu li.iehover li.iehover li.iehover li a { background: #FFF; color: #06C; } /* 4th Menu Hover */ ul#navmenu li:hover li:hover li:hover li a:hover, ul#navmenu li.iehover li.iehover li.iehover li a:hover { background: #F9F9F9; color: #900; } ul#navmenu ul, ul#navmenu ul ul, ul#navmenu ul ul ul { display: none; position: absolute; top: 0; left: 230px; } /* Do Not Move - Must Come Before display:block for Gecko */ ul#navmenu li:hover ul ul, ul#navmenu li:hover ul ul ul, ul#navmenu li.iehover ul ul, ul#navmenu li.iehover ul ul ul { display: none; } ul#navmenu li:hover ul, ul#navmenu ul li:hover ul, ul#navmenu ul ul li:hover ul, ul#navmenu li.iehover ul, ul#navmenu ul li.iehover ul, ul#navmenu ul ul li.iehover ul { display: block; } .avviso_menu_vuoto { background: #FFF; color: #06C; border-bottom-width: thin; border-bottom-style: dotted; border-bottom-color: #666; } </style> </head> <body> <!--[if gte IE 5.5]> <script language="JavaScript" type="text/JavaScript"> navHover = function() { var lis = document.getElementById("navmenu").getElementsByTagName("LI"); for (var i=0; i<lis.length; i++) { lis[i].onmouseover=function() { this.className+=" iehover"; } lis[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" iehover\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", navHover);</script> <![endif]--> <ul id='navmenu'>[*]http://[img]virgolette.gif[/img] Voc....gif[/img] <ul>[*]http://[img]virgolette.gif[/img] Voc....gif[/img] <ul>[*]http://[img]virgolette.gif[/img] Voc....gif[/img] <ul>[*][img]virgolette.gif[/img] Voce di menu non in... [/list] [/list] [/list] [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [*][img]virgolette.gif[/img] Voce di menu non in... [/list] </body> </html>
Rispondi quotando