possiamo assegnare la larghezza di li

ho seguente pagina HTML con UL e LI, provo ad assegnare la larghezza di ciascuna LI, ma non riesco a vedere il successo Caypossiamo assegnare la larghezza di li

<html> 
    <head> 
    <style type="text/css"> 

    ul 
    { 
     overflow-x:hidden; 
    white-space:nowrap; 
    height: 1em; 
     width: 100%; 
    } 

    li 
    { 
    display:inline; 
    padding-right:10px; 
     }  
     </style> 
    </head> 
    <body> 

    <ul> 
     <li style="width:100px">abcdefghijklmonpqrstuvwxyz</li> 
     <li>abcdefghijklmonpqrstuvwxyz</li> 
    <li>abcdefghijklmonpqrstuvwxyz</li> 
    <li>abcdefghijklmonpqrstuvwxyz</li> 
    <li>abcdefghijklmonpqrstuvwxyz</li> 
    <li>abcdefghijklmonpqrstuvwxyz</li> 
     <li>abcdefghijklmonpqrstuvwxyz</li> 
    </ul> 

    </body> 
    </html>

perché ogni mio Li è diversa larghezza.

Grazie

fonte

2010-04-23 air

No, non è possibile assegnare la larghezza a tutto ciò che è visualizzato in linea, che è stato impostato come LI. Invece, si preferisce utilizzare spesso lo display: block; float: left; che consente di impostare la larghezza.

fonte

2010-04-23 15:18:08

Si stanno dando la li s display: inline e width non si applica ai inline elementi. Avrai bisogno di usare un'alternativa per posizionare gli elementi l'uno di fianco all'altra come fluttuarli.

fonte

2010-04-23 15:18:01 RoToRa

Provate a sostituire il vostro display:inline da display:inline-block

fonte

2010-04-23 15:18:53 Gregoire

questo farà il trucco, a meno che tu non sia interessato a mantenere il codice XHTML compatibile. inline-block non è supportato completamente cross browser: http://www.quirksmode.org/css/display.html#t03 –

+1 Questo dovrebbe essere il modo di fare ciò che l'OP vuole. Ma IE (6 e 7?) Applicherà solo 'display: inline-block;' a elementi che sono naturalmente inline ('span', ad esempio), quindi bisogna stare attenti con il blocco inline per le pagine che si intendono per essere compatibile con i browser * obsoleti *. – ANeves

per fornire più sulle due precedenti risposte, non è possibile specificare la linea di larghezza, ma è possibile controllare un esempio su come farlo here

fonte

2010-04-23 15:24:13 Christin

Prova questo CSS

ul { 
white-space: nowrap; 
height: 1em; 
width: 100%; 
} 

li { 
list-style-type: none; 
width: 100px; 
overflow-x: auto; /* change to hidden if that's what you want */ 
float: left; 
margin-right: 10px; 
}

fonte

2010-04-23 15:29:32 Mottie

possiamo assegnare la larghezza di li

risposta

Problemi correlati