Come evitare interruzioni di riga negli elementi di elenco tramite CSS

Sto cercando di inserire un link chiamato Invia curriculum in un menu utilizzando un tag li . A causa dello spazio bianco tra le due parole si avvolge su due righe. Come evitare questo involucro con i CSS?

Usa white-space: nowrap; 1 , o dare a quel link più spazio impostando la larghezza di li su valori maggiori.

Potresti aggiungere questo piccolo frammento di codice per aggiungere un bel “…” alla fine della riga se il contenuto è troppo grande per stare su una riga:

 li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 

Se si desidera ottenere questo risultato in modo selettivo (ovvero: solo per quel particolare collegamento), è ansible utilizzare uno spazio non interruttivo anziché uno spazio normale:

 
  • submit resume
  • http://en.wikipedia.org/wiki/Wikipedia:Line-break_handling#.26nbsp.3B

    modifica: capisco che questo è HTML, non CSS come richiesto dall’OP, ma alcuni potrebbero trovare utile …

    display: blocco in linea; impedirà le interruzioni di riga negli articoli dell’elenco

    http://jsfiddle.net/Nash171/mwe4s0nc/46/

      li{ display: inline-block; } 

    Bootstrap 4 ha una class chiamata text-nowrap . È proprio quello di cui hai bisogno.