Disco a sinistra della voce di elenco viene visualizzato in basso

Question

Schermata di ciò che sta accadendo:

E 'solo un elemento della lista all'interno di un elenco underordered, questo sta accadendo in IE7 e non altrove.

<ul> 
    <li>Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text. Filler text.</li> 
</ul> 

.fancybox-entry.computer-policy li { 
    float:none; 
    width:100%; 
    list-style-type:disc; 
    margin-bottom:10px; 
} 

.fancybox-entry.computer-policy ul + p { 
    margin-bottom:20px; 
} 

.fancybox-entry.computer-policy ul { 
    margin:5px 0 10px 25px; 
} 

Qualsiasi aiuto sul motivo per cui lo sta facendo e una correzione è apprezzata.

Answer 1

Sembra che la larghezza di proprietà CSS trigger abbiaLayout per l'elemento li in IE7. Prima prova a rimuovere la dichiarazione width:100%; per assicurarti che il proiettile appaia nella posizione corretta. Se non è possibile fare a meno della proprietà width, è possibile utilizzare position: relative; e vertical-align: top; per riportare in posizione il punto elenco, come indicato allo http://www.gunlaug.no/tos/moa_26.html.

Si noti che il codice su quella pagina utilizza hack per targetizzare IE6 e IE7. Mi consiglia di utilizzare i commenti condizionali, invece, in questo modo:

<!--[if IE 7]> 
    <style type="text/css" media="screen"> 
    /* IE7-specific CSS here */ 
    </style> 
<![endif]--> 

Answer 2

La mia reputazione è ancora troppo basso per commentare, altrimenti avrei aggiunto questo alla risposta di peterjmag. (Forse può includerlo ...)

La proprietà width è il colpevole, ma suggerirei un cambiamento diverso. Per assicurarti che gli elementi della tua lista occupino tutta la larghezza in IE7, usa invece "width: auto". Questo ti darà lo stesso aspetto e i tuoi punti elenco prenderanno il loro posto. Ho scoperto che "vertical-align: top/text-top" spinge i punti dei proiettili poco più a nord di dove vorrei.

Se non si dispone di classi condizionali o di un foglio di stile IE, è sufficiente utilizzare "* larghezza: auto" per scegliere come target IE7.