text-overflow: puntini di sospensione per la prima linea quando le interruzioni di linea

Question

Ho un div con i CSS:

div.c 
{ 
font-size: 18px; 
color: #888; 
max-width: 300px; 
display: inline-block; 
overflow: hidden; 
line-height: 20px; 
text-overflow: ellipsis; 
word-break: break-all; 
} 

The content in this div is "Abcdef abcdefabcdefabcdefabcdefaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa" //for example, given only to show length in div.

Ma se viene utilizzato il precedente CSS, il contenuto div sarà interrotto e anche senza three dots //as of text-overflow: ellipsis;. Se rimuovo word-break: break-all; allora verranno formate due linee con la prima parola sulla prima riga e la seconda sulla seconda. Ma text-overflow: ellipsis; funziona con questo.

Cosa posso fare per mantenere tutto il testo su una riga e anche per effettuare il lavoro text-overflow: ellpsis;?

Grazie!

Answer 1

white-space: nowrap; È ciò di cui hai bisogno Credo.