IE8 wraps label text when it shouldn't

[bbrdaric]

Hello,

a fix that solved #13141 is now causing another misbehavior of label in IE8 when using Bootstrap 3.3.1. Reverting to 3.1.1 solves that problem.

It seems that now label width cannot be correctly calculated and breaks when it's floating.

I believe that @ahocquet also noticed this and mentioned in #13141 (comment)

For now, as a workaround for this problem, we detect ie8 using conditional comments and override max-width with something like this

.lt-ie9 label {
    max-width: inherit;
}

Reduced examples

http://sandbox.boris-samardzija.from.hr/bootstrap/bootstrap-3.3.1.html
http://sandbox.boris-samardzija.from.hr/bootstrap/bootstrap-3.1.1.html

Screenshots

Problematic label wrapping in 3.3.1

Seems okay in 3.1.1

[cvrebert]

JS Bin for posterity: http://jsbin.com/baqilu/2

[kkirsche]

Is there a reason we are using display: inline-block instead of simply display: inline? Changing to display: inline; fixes this issue in IE 8 with no noticeable issues in the JSBin on other browsers (that I can see). Let me know if you want this as a pull request

[kkirsche]

Just wanted to follow up regarding this and see if there is a reason we are using display: inline-block instead of simply display: inline?

[cvrebert]

CC: @mdo

[cvrebert]

The last change was from block to inline-block, in fe8061b.

[bbrdaric]

@kkirsche, try that on "Basic example" on http://getbootstrap.com/css/#forms and you will notice that there is difference in margins (bottom margin will be ignored).

Label element is inline by default, but in order to use margins and/or width/height, it must be inline-block or block.

This seems to be caused by unfortunate combination of inline-block and max-width, so I would suggest to find another solution for #13141 (which is also IE8 bug) that wouldn't stop us from using inline-block on labels (which is working okay in modern browsers).

[kkirsche]

I see what you mean @borissamardzija — thanks for sharing that example, I was just looking at the JSBin

[mdo]

Yup, for all the reasons @borissamardzija mentioned.

[mdo]

Punting as a won't fix as well for now.