2012-09-16 14 views
12

Ho impostato lo list-style-type in CSS, ma per qualche motivo non lo mostra.Tipo stile elenco CSS non funzionante

body { 
 
    margin: 0; 
 
} 
 
ol { 
 
    list-style-type: decimal; 
 
    padding-left: 0; 
 
}
<ol> 
 
    <li>Item 1</li> 
 
    <li>Item 2</li> 
 
    <li>Item 3</li> 
 
</ol>

+3

Controlla il tuo margine e riempimento ... – yckart

risposta

46

A causa della tua ripristino imbottiture, i numeri sono in realtà fuori alla sinistra della pagina. Prova ad aggiungere:

list-style-position: inside; 
4

Decimale è il valore predefinito per un "ol". Non c'è bisogno di dichiararlo. Anche i numeri ci stanno semplicemente cadendo dal lato della pagina, cioè invisibili. Regola il tuo padding e sbarazzati della dichiarazione ridondante. See here

+0

Grazie per il consiglio. Ho sempre pensato che alcuni browser usassero stili diversi, e il tipo di stile ol può variare, questo è il motivo per cui l'ho messo lì. – SeinopSys

+2

da w3c "Gli elenchi ordinati e non ordinati sono resi in modo identico, ad eccezione degli elementi di elenco ordinati degli agenti utente visivi Gli agenti utente possono presentare tali numeri in vari modi: gli elementi di elenco non ordinati non sono numerati." – noel

+0

Se capita di utilizzare in anticipo un file di ripristino CSS, il valore ol può essere impostato su un valore diverso – iBorg

12
display:list-item; 
list-style-position:outside; 

Essa può dare problemi se la lista display: attributo è impostato su qualche altra cosa rispetto display:list-item;

0

semplicemente rimuovere "display: block;" dal tuo elemento li

2

Se non funziona, assicurati di non avere elementi contrassegnati in modo esplicito come blocco di visualizzazione all'interno della LI. Mi è appena capitato con un set di H4 A come blocco all'interno della LI. Stavo per dare le dimissioni