Come disattivare il ritorno a capo automatico in HTML?

518

Mi sento sciocco per non essere riuscito a capirlo, ma come posso disattivare il wordwrap? il css word-wrapproprietà può essere forzato su con break-word, ma non può essere forzato off (solo può essere lasciato solo con normalil valore).

Come forzo parola avvolgere off ?

html css word-wrap

— Alexander Bird
fonte

853

Devi usare l' white-spaceattributo CSS .

In particolare, white-space: nowrape white-space: presono i valori più comunemente usati. Il primo sembra essere quello che cerchi.

— Jon
fonte

25

Aggiunti valori specifici del webkit mancanti dall'alto

white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera */
white-space: pre-wrap; /* Chrome */
word-wrap: break-word; /* IE */

— Matas Vaitkevicius
fonte

3

Mi chiedo perché trovi come soluzione lo "spazio bianco" con "nowrap" o "pre", non sta facendo il comportamento corretto: imponi il tuo testo in una sola riga! Il testo dovrebbe spezzare le righe, ma non interrompere le parole come impostazione predefinita. Ciò è causato da alcuni attributi CSS: word-wrap, overflow-wrap, word-break e trattini. Quindi puoi avere:

word-break: break-all;
word-wrap: break-word;
overflow-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

Quindi la soluzione è rimuoverli o sovrascriverli con "unset" o "normale":

word-break: unset;
word-wrap: unset;
overflow-wrap: unset;
-webkit-hyphens: unset;
-moz-hyphens: unset;
-ms-hyphens: unset;
hyphens: unset;

AGGIORNAMENTO: fornisco anche prove con JSfiddle: https://jsfiddle.net/azozp8rr/

— Zod
fonte

1

Capisco perché vuoi rompere le parole in generale. Ma supporre che non ci sia alcun motivo valido per cambiare la parola a capo non ha senso per me. Ho rapidamente provato a testare la tua soluzione "non impostata" e aveva ancora la parola a capo. Se pensi che dovrebbe funzionare, ti preghiamo di fornire una demo di jsfiddle facendolo funzionare.

— Alexander Bird,

Non so perché la mia risposta sia svanita. Ancora una volta, puoi forzare nowrap, di solito le persone lo fanno per i pulsanti. Ma penso che sia una cattiva progettazione per motivi di risposta, perché i testi potrebbero andare fuori dal contenitore. Ad ogni modo, la domanda era sulla parola a capo: parola d'ordine, forzata, e tu chiedevi come forzare. Quindi, ho fornito il codice per farlo. Lo spazio bianco: nowrap è un'altra cosa, e non rimuove le parole spezzate, sta rimuovendo le intere linee. Fornisco anche un confronto del codice con JSfiddle: https://jsfiddle.net/azozp8rr/

— zod

2

Questo ha funzionato per me per impedire che si verifichino interruzioni di lavoro stupide all'interno delle textareas di Chrome

word-break: keep-all;

— Ryan Charmley
fonte