Quando il testo è senza spazi e più rispetto alla dimensione div 200px è che scorre fuori La larghezza è definita come 200px Ho posto il mio codice qui http://jsfiddle.net/madhu131313/UJ6zG/ Potete vedere le immagini qui sotto modificati: voglio che il testo per passare alla riga successivatesto scorre fuori div
risposta
E 'a causa del fatto che si dispone di una sola parola a lungo senza spazi. È possibile utilizzare la proprietà wrap di testo per interrompere il testo:
#w74 { word-wrap: break-word; }
Ha anche un discreto supporto del browser. See documentation about it here.
Si dovrebbe usare overflow:hidden;
o scroll
o con php si potrebbe brevi le parole lunghe ...
utilizzare overflow:auto
darà uno scroller al testo all'interno dello div
:).
Se è solo un'istanza che deve essere racchiusa su 2 o 3 righe, utilizzare solo alcuni <wbr>
nella stringa. Tratterà quelli come <br>
ma non inserirà l'interruzione di riga se non è necessario.
<div id="w74" class="dpinfo">
adsfadsadsads<wbr>fadsadsadsfadsadsa<wbr>dsfadsadsadsfadsadsads<wbr>fadsadsadsfadsadsadsfa<wbr>dsadsadsfadsadsadsfadsad<wbr>sadsfadsadsads<wbr>fadsadsadsfadsads adsfadsads
</div>
Ecco un violino.
Usa
white-space: pre-line;
Sarà impedire che il testo che scorre fuori dal div
. Interromperà il testo non appena raggiunge la fine dello div
.
Questo ha funzionato per me! – aletede91
l'ho incontrato di recente. Ho usato: display:block;
È necessario applicare le seguenti proprietà CSS al blocco contenitore (div):
overflow-wrap: break-word;
Secondo le specifiche (fonte CSS | MDN):
La proprietà
overflow-wrap
CSS specifica se il browser deve inserire interruzioni di riga all'interno delle parole per impedire che il testo trabocchi dalla sua casella di contenuto.
Con il valore impostato break-world
Per evitare overflow, normalmente parole infrangibili possono essere suddivisi in punti arbitrari se non vi sono tuttavia punti di rottura accettabili nella linea.
Da segnalare ...
La struttura era in origine un'estensione di Microsoft non standard e senza prefisso chiamato
word-wrap
, ed è stato attuato dalla maggior parte dei browser con lo stesso nome. Da allora è stato rinominato inoverflow-wrap
, conword-wrap
è un alias.
Se vi preoccupate per i browser legacy supportano vale la pena specificando:
word-wrap : break-word;
overflow-wrap: break-word;
Ex. IE9 non riconosce overflow-wrap
ma funziona bene con word-wrap
- 1. jQuery Droppable: lasciare fuori div?
- 2. Il testo scorre al di fuori del riquadro della casella UITextView
- 3. Android: ScrollView non scorre con la tastiera fuori
- 4. arresto AppBarLayout scorre fuori dallo schermo quando NestedScrollView è vuoto
- 5. pagina Samsung Smart TV scorre fuori di vista in risposta a up-down tasti premuti
- 6. Rileva clic fuori div utilizzando javascript
- 7. Xcode scorre il testo durante la digitazione
- 8. per scrivere lettere fuori testo
- 9. Il testo nella vista testo scorre in Android 3.0
- 10. Fill div con testo
- 11. Ipad div contenuto non scorre quando si utilizza come popup
- 12. Fix div quando scorre del browser ad esso
- 13. Come si fa a seguire un div mentre si scorre?
- 14. Il div assoluto non scorre con la pagina
- 15. Javascript: scorre da un div all'altro durante lo scorrimento?
- 16. assegnando indice testo jquery div
- 17. Resto del testo in div
- 18. Append div al testo selezionato
- 19. Modifica testo fuori dallo schermo con GridLayout
- 20. Cattura clic al di fuori di un div assoluta posizionato
- 21. visualizzazione bootstrap popover fuori div con overflow: nascosto
- 22. jQuery UI Tooltip si muove fuori genitore div
- 23. Bootstrap carosello: immagini fuori div durante lo scorrimento
- 24. grafico d3 visualizzato al di fuori del bootstrap div
- 25. Spostare il testo in un div senza spostare il div
- 26. Come trasferire il testo da DIV a DIV?
- 27. Non sai come nascondere un div quando si fa clic al di fuori della div
- 28. Rendere il Bootstrap 3 Carousel una singola immagine statica su cui scorre il testo
- 29. Clear inside div A sta cancellando il float di div B, che è al di fuori di div A
- 30. UIView anima la diapositiva ma non la scorre fuori usando il metodo di animazione dei blocchi
Awesome.sorry parlare voglio andare alla riga successiva, come la chat di Gmail o Facebook Chat :) – ZenOut
Quindi è possibile utilizzare @chipcullen 's versione con parola- avvolgere! demo: http://jsfiddle.net/UJ6zG/3/ –