Drop Down Menu compatibile con internet explorer

Fxxxx

Utente Attivo
17 Set 2011
63
0
0
Ciao
vorrei creare un drop down menu compatibile con Internet Explorer (7 ma speravo anche 6).
Avevo scritto questo (come codice css)
HTML:
#menu {
	width:700px;
	height:70px;
	float:right;
}
#menu ul {
	width:700px;
	list-style:none;
	margin-top:0px;
	margin-bottom:0px;
	margin-right:20px;
	float:right;
}
#menu li {
	width:102px;
	display:inline-block;
	display: -moz-inline-box;
	height:70px;
	vertical-align:middle;
}

* html #menu li { display:inline; }  /* hack per IE 6 */
* + html #menu li { display:inline; } /* hack per IE 7 */


#menu a {
	width:102px;
	height:70px;
	display:table-cell;
	text-decoration:none;
	text-align:center;
	vertical-align:middle;
	font-weight:600;
}

#menu li:hover ul {
	display:block;
}
#menu li>ul {
	width:150px;
	display:none;
	position:absolute;
	margin:0px;
	padding:0px;
	border-style:solid;
	border-width:2px;
	border-color:#EBEBEB;
	border-radius:5px;
}
#menu li>ul li {
	width:150px;
	display:block;
}
#menu li>ul>li a {
	width:150px;
}
#menu li>ul>li ul {
	margin-left:150px;
	visibility:hidden;
	margin-top:-72px;
	border-style:solid;
	border-width:2px;
	border-color:#EBEBEB;
	border-radius:5px;
}
#menu li>ul li:hover ul {
	visibility:visible;
}

La struttura HTML è così:
HTML:
<div id="menu">
            	<ul>
                	<li>
                    	<a href="www.google.it">Home</a>
                        <ul>
                        	<li>
                            	<a href="www.google.it">Home Sotto 1</a>
                                <ul>
                                    <li><a href="www.google.it">Home Sotto Sotto 1</a></li>
                            	    <li><a href="www.google.it">Home Sotto Sotto 2</a></li>
                                    <li><a href="www.google.it">Home Sotto Sotto 3</a></li>
                                    <li><a href="www.google.it">Home Sotto Sotto 4</a></li>
                                    <li><a href="www.google.it">Home Sotto Sotto 5</a></li>
                                </ul>
                            </li>
                            <li><a href="www.google.it">Home Sotto 2</a></li>
                        </ul>
                    </li>
                    <li>
                    	<a href="www.google.it">Contatti</a>
                        <ul>
                        	<li>
                            	<a href="www.google.it">Contatti Sotto 1</a>
                                <ul>
                                	<li><a href="www.google.it">Contatti Sotto Sotto 1</a></li>
                            		<li><a href="www.google.it">Contatti Sotto Sotto 2</a></li>
                                    <li><a href="www.google.it">Contatti Sotto Sotto 3</a></li>
                                </ul>
                            </li>
                            <li><a href="www.google.it">Contatti Sotto 2</a></li>
                            <li><a href="www.google.it">Contatti Sotto 3</a></li>
                        </ul>
                    </li>
                    <li><a href="www.google.it">Prodotti</a></li>
                    <li><a href="www.google.it">Dove siamo</a></li>
                    <li><a href="www.google.it">Contatti</a></li>
                    <li><a href="www.google.it">Contatti</a></li>
                </ul>
            </div>

A parte che gli :hover non sono riconosciuti il mio problema riguarda la visualizzazione del semplice menu... (che in internet explorer 7 viene un link vicino all'altro...)
Pensavo di risolvere il problema del :hover con uno script javascript che cambia le classi css....

Un "bravo" a chi riesce a capire come rendere compatibile il menu...

ciao
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
J Drop down menu HTML e CSS 0
M Creare un menu drop-down in app Android Sviluppo app per Android 1
D Come posso rendere obbligatorio un drop down menu? Javascript 12
S AIUTO piccola modifica Drop Down Menu Javascript 0
D Menu Drop Down HTML e CSS 0
J Animated Drop Down Navigation Menu Javascript 0
Z Recupero Values da Drop Down menu: Questioni PHP 0
U Aiuto per Drop Down Menu tre livelli PHP 0
G menu orizzontale drop-down HTML e CSS 0
X-Zeus Drop-Down Menu in php PHP 3
M [PHP] Drop down in campo select PHP 1
S Problema drop-down box PHP 22
A funzione per popolare un drop down list Javascript 4
J FAQ Drop Down script Javascript 0
D drop down & flash Javascript 0
S errore nel compilare una drop down list ASP.NET 0
M [PHP] Interrompere DROP TABLE con PDO PHP 0
L [Javascript] Drag and drop. Aggiornamento Campo Javascript 2
O Drop menu o menu a tendina HTML e CSS 5
R Drop database jolly MySQL 1
J Jquery ui drag drop move jQuery 0
G Piccolo problema con il Drag&Drop jQuery 0
P sito e-commerce drop shipping E-Commerce 3
S Selezionare files con drag and drop prima di upload PHP 0
A Drag and drop per ipad , questo sconosciuto... Javascript 1
R ordinamento immagini con drag and drop e memorizzazione db PHP 1
A copiare dati in mysql con drag & drop jQuery 0
P drag e drop disabilitato con jquery Javascript 1
max1974 grid e json con drag e drop jQuery 0
M Upload con drag and drop PHP 1
zighy memorizzare gli elementi di un drag n drop Javascript 4
zighy drag drop Javascript 11
D Drag and drop immagini non compatibile con FF Javascript 1
D Drag & drop HTML5. Problema con ie e chrome! HTML e CSS 1
renegade Vendo Agenda prenotazioni sistema Drag & Drop Offerte e Richieste di Lavoro e/o Collaborazione 0
WorldWideWeb Drag&Drop su TreeView Visual Basic 0
L java,oggetti grafici e drag and drop Java 2
Trogo Mysql: Drop all tables MySQL 0
J Drag and drop in vb Visual Basic 1
N drag & drop Flash 1
E drag & drop Flash 1
M complesso drag&drop Flash 0
T [HTML] Problema pulsante scroll down su ecommerce CMS (Content Management System) 0
A [HTML] Menu con effetto slide down HTML e CSS 0
F Slide down/up dropdown Bootstrap jQuery 0
Z Script per db down Javascript 1
A aruba down? Hosting 0
I aiutoooo server down Hosting 0
G Count down Flash 0
jan267 Aruba Down Hosting 1

Discussioni simili