Comment puis-je faire de Firefox word-break avec CSS?

voici mon code:

<div style="width:100px;height:100px;background:red">
            ssssssssssssssssssssssssssssssssssssss
</div>

Cependant,

word-wrap:break-word;
word-break:break-all;

ne s'avère pas utile, car il ne peut pas word-wrap sur Firefox. Que puis-je faire, à l'aide de CSS<!--8?

38
demandé sur wpp 2010-11-26 08:33:15

8 réponses

white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
width:200px;

ci-dessus morceau de code qui fonctionne pour moi à merveille

53
répondu 2lessons 2012-09-02 11:09:04

Utiliser les règles suivantes ensemble:

/* For Firefox */
white-space: pre-wrap;
word-break: break-all;

/* For Chrome and IE */
word-wrap: break-word;
26
répondu Kay 2013-05-04 10:31:25
.content-div{
    word-break:break-all;
    word-wrap: break-word;
}

Et ajouter en dessous de style sur la table qui est lié dans la div

style='table-layout:fixed;width:306px;'
16
répondu Pankaj Pareek 2011-10-05 09:17:21

vous utilisez la largeur et les propriétés d'affichage ainsi que la propriété word-wrap:

width: 100px;
word-wrap: break-word;
display:inline-block;

cela fonctionne pour moi à la fois EN MI et en FF.

11
répondu Lida 2011-12-23 10:49:59

cela fonctionne de cette façon pour Firefox:

word-break: initial;
word-wrap: break-word;
9
répondu Mauro 2015-03-16 06:05:03

Que Diriez-vous si nous essayions ceci:

div{ overflow-wrap:break-word; }
2
répondu darcher 2017-01-04 21:48:38

Qui fonctionnent pour moi bien:

/* For Firefox */
white-space: pre-wrap;
overflow-wrap: break-word;

/* For Chrome and IE */
word-wrap: break-word;

il semble overflow-wrap est quelque chose de nouveau dans firefox. Plus d'informations peuvent être trouvées ici:

https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap

2
répondu Kaloyan Stamatov 2017-08-31 09:29:17

Utilisez les styles ci-dessous cela a bien fonctionné pour moi dans mozilla firefox.

word-wrap: break-word;
display:block;
-1
répondu Ramya 2018-09-19 07:06:51