paper-checkbox icon indicating copy to clipboard operation
paper-checkbox copied to clipboard

Paper-checkbox label does not wrap correctly

Open WoodyWoodsta opened this issue 8 years ago • 6 comments

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 :stuck_out_tongue_closed_eyes:): screenshot from 2016-01-31 22 28 49

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.

WoodyWoodsta avatar Jan 31 '16 20:01 WoodyWoodsta

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

notwaldorf avatar Feb 03 '16 22:02 notwaldorf

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

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

danbeam avatar Aug 23 '16 23:08 danbeam

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

danbeam avatar Aug 23 '16 23:08 danbeam

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

notwaldorf avatar Aug 23 '16 23:08 notwaldorf

@tjsavage

danbeam avatar Sep 20 '16 02:09 danbeam

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:

paper-checkbox-wrapping

davidmaxwaterman avatar May 25 '18 09:05 davidmaxwaterman