problemi con internet explorer

[foxissimo]

Ciao a tutti.

ho un problema di incompatibilità su internet explorer.

questa pagina panathlonmondovi.it contiene questo menu:

    <div id="menu">
       
        <div id="voci-menu">
        	<ul>
            	<li class="storia">
                <li class="soci">
                <li class="attivita">
	            <li class="etica">
                <li class="convenzioni">           [/list]
        </div> 
        
    </div>

so che non è corretto inserire un elemento dell'elenco all'interno di un tag <a> ma questo meriterebbe un post a parte.

css:

	div#voci-menu ul a {
		margin:0;
		padding:0;
		}
	
	div#voci-menu ul a li {
		list-style:none;
		display:inline-block;
		width:128px;
		height:70px;
		
		
		font-variant:small-caps;
		color:white;
		font-weight:bold;
		font-size:17px;
		border-radius: 8px;
 		-moz-border-radius: 8px; /* firefox */
 		-webkit-border-radius: 8px; /* safari, chrome */	

	}
	/*
	div#voci-menu ul li a {
		text-decoration:none;
		color:white;
	}*/
	
	div#voci-menu ul a li.convenzioni:hover,div#voci-menu ul a li.storia:hover, div#voci-menu ul a li.soci:hover, div#voci-menu ul a li.attivita:hover, div#voci-menu ul a li.etica:hover {
		border-top:3px solid white;
		border-bottom:3px solid white;
		height:64px;
		
		cursor:pointer;
	}

/*in più ogni li del menu ha un'immagine di sfondo.*/

perchè con internet explorer il menu resta in verticale?
perchè non viene visualizzato il puntatore del mouse "pointer" sulle voci del menu?
e soprattutto... perchè il plug-in di jquery colorbox, che apre diversi link della pagina, non funziona bene? eppure è assicurata la massima compatibilità con Internet Explorer 6, 7, 8, 9.

[simo22]

Il primo problema è dovuto al fatto che IE non supporta inline-block. Devi usare il display block e i float per farlo funzionare bene.

Per il secondo non ti saprei rispondere.

Per il terzo neanche.

[kumiko]

riguardo alla seconda domanda anche io ho notato lo stesso problema: il puntatore compare solo se c'è una scritta o un contenuto di qualsiasi tipo nel link. Anche se ci metti uno spazio il puntatore compare mentre se lo lasci vuoto () il puntatore non c'è. Ed è un problema che fa solo IE perché con ogni altro browser, il link funziona come link anche senza contenuto dentro... devo ancora capire:

a cosa è dovuto;
come sistemarlo.

Nel tuo caso, se puoi mettere un contenuto fittizio (il famoso "andNoBreakSpace" ad esempio) ti risolvi il problema (nel mio caso purtroppo non posso, devo ingegnarmi in una soluzione più creativa!)

[Mich_]

Attenzione perche` un oggetto vuoto puo` venir ignorato dai browser. Fa parte delle specifiche HTML.

(il motivo e` che i database vanno di solito a scrivere pezzi di codice che sono inclusi in un blocco che il DB non controlla - quando il DB e` vuoto, anche il contenitore puo` venir ignorato)

[kumiko]

mich, ti riferisci al problema del puntatore?

perché, almeno nel mio caso, io ho impostato i link con una altezza e una larghezza e trasformati in elementi di blocco quindi il problema non dovrebbe porsi, tant'è vero che tutti gli altri browser li vedono, anche se dentro il link non ho nessun contenuto. Il problema è solo con IE, che legge il link solo se vi è una scritta all'interno. E' come se non considerasse le istruzioni "display: block; width e height", e non capisco perché.

[Mich_]

Perche` un elemento vuoto puo` venir completamente ignorato.
Alcuni browser lo fanno, altri li inseirscono comunque.
Anche se l'oggetto vuoto e` di tipo block, se viene ignorato e` come se non ci fosse, quindi non ha senso definirne le dimensioni.