Paper-checkbox label does not wrap correctly

[WoodyWoodsta]

Sizing the paper-checkbox element in any way such that the label starts to need to wrap causes the label to flow outside of the width of the element. The label appears to not wrap for a width that of the checkbox div outside of the entire element. In other words, getting rid of the checkbox div fixes the issue.

Below is the usage of the checkbox in my app (excuse the label 😝):

And here is a reduced test case.

The issue is present in latest Firefox security release (44.0), as well as Chrome 50.0.2633.3. I don't have access to others.

[notwaldorf]

This is true. I wonder if this could be fixed with a flex box, and forcing the items to align at the top

[danbeam]

@notwaldorf flex box would be swell, @hcarmona's fix would probably work as well, though

fyi: this is affecting chrome://md-settings

[danbeam]

https://bugs.chromium.org/p/chromium/issues/detail?id=620002#c11

[notwaldorf]

cc @bicknellr -- I am not paper-checkbox's keeper anymore :)

[danbeam]

@tjsavage

[davidmaxwaterman]

this is still a problem - paper-checkbox#1.4.2 - the label only wraps when it touches the label of the checkbox next to it: