Overflow di testo CSS: i puntini di sospensione funzionano sui tag di ancoraggio?

Question

Perché il seguente CSS non funziona?

a { 
    width: 60px; 
    overflow: hidden; 
    white-space: nowrap; 
    text-overflow: ellipsis; 
} 

Answer 1

È perché le ancore sono di serie, inline elementi. L'aggiunta di display:inline-block farà funzionare il codice sopra.

Answer 2

E 'per il modello di dialogo, display:block farà il lavoro

a { 
    width: 60px; 
    display:block; 
    overflow: hidden; 
    white-space: nowrap; 
    text-overflow: ellipsis; 
}​ 

ma può causare altri problemi per rendere l'ancora (elemento in linea) si comportano come elemento del modello di dialogo (display: block).

Riferimento:text-overflow

Aggiornamento:

display:inline-block 

Demo.

Answer 3

Aggiungi display: block al tuo css.