Jez Jez - 1 month ago 5
CSS Question

IE11 flexbox preventing text wrapping?

I am developing a site which displays OK in the latest versions of Firefox/SeaMonkey/Chrome, but interestingly in IE11 there is a rendering problem:

http://devel.gooeysoftware.com/mozaddons/switching.php

If you load this in IE11, the "Switching from Firefox to SeaMonkey" menu item along the left does not get its text wrapped to the size of the containing DIV, but instead overflows. I can't see why this is. Is it just a bug in IE11 or am I missing some CSS to get it to wrap?

UPDATE:

Looks like they fixed a bunch of the IE11 flexbox rendering bugs in Edge.

IE11:

IE11 rendering

Edge:

Edge rendering

Jez Jez
Answer

As far as I can tell, IE's flexbox implementation is just broken. That's the long and short answer to this question. The text should be wrapping, but it isn't. It does in Firefox and Chrome.

UPDATE:

IE11's flexbox implementation was indeed broken. This now renders properly in Edge.

Comments