Word-Wrap Not Working in Internet Explorer

Internet Explorer 11 word wrap is not working

In order to ensure that the answer is obvious to people visiting this question in the future: the OP (wesley) answered the question himself in the comments beneath the question:

The cause of the problem is that Internet Explorer 11 makes textarea elements inherit whatever white-space property is applied to the direct parent.

The resolution is to apply white-space: pre-wrap to the textarea, as identified by Jean-François Beauchamp.

Word-wrap not working in Internet Explorer

you need to have

table {
    width:100%;
    table-layout:fixed;
}

and put word-wrap in table,td,th not into span

http://jsfiddle.net/d6VsD/7/

word-wrap does not work in IE

As word-wrap is a CSS3 property, it is only supported by IE9 and higher. For IE8 try

-ms-word-wrap

So try

div.break_word {
    width: 690px;
    word-wrap: break-word;
    -ms-word-wrap: break-word;
}

Hope this helps.

Update

It seems that even if you use -ms-word-wrap in IE7, it defaults the white-space: nowrap; which then overrides the word-wrap property.

Once again a IE hack is required. Try adding this for IE7.

white-space: normal; 

CSS word-wrap: break-word don't work on IE9

I remove the anchor tag after .tab_title class and it works

word-wrap:break-word not working in IE8

If I recall correctly, word-wrap: break-word; is indeed supported in Internet Explorer 8, but the styled element must have layout.

Text in a flex container doesn't wrap in IE11

Add this to your code:

.child { width: 100%; }

We know that a block-level child is supposed to occupy the full width of the parent.

Chrome understands this.

IE11, for whatever reason, wants an explicit request.

Using flex-basis: 100% or flex: 1 also works.

.parent {  display: flex;  flex-direction: column;  width: 400px;  border: 1px solid red;  align-items: center;}.child {  border: 1px solid blue;  width: calc(100% - 2px);       /* NEW; used calc to adjust for parent borders */}

<div class="parent">  <div class="child">    Lorem Ipsum is simply dummy text of the printing and typesetting industry  </div>  <div class="child">    Lorem Ipsum is simply dummy text of the printing and typesetting industry  </div></div>

---

Related Topics