checkbox. Release 1.1.0-rc.5. Chrome v.52. Label is not centered

[vladimir-barsuchenko]

I use your latest Angular Material Release 1.1.0-rc.5.
And your official codepen.
Windows 10. Chrome Version 52.0.2743.116 m

When I resize a window or simply checkbox parent container. Label position is calculated wrong.
It seems like the trouble is in fractional numbers. And Chrome has issues with it.
Because if I increase width of checkbox container in 1px alignment is perfect.

I have no issues with latest Firefox.

md-checkbox.md-checked ._md-icon:after {
    box-sizing: border-box;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    left: 6.67px;
    top: 2.22px;
    display: table;
    width: 6.67px;
    height: 13.33px;
    border-width: 2px;
    border-style: solid;
    border-top: 0;
    border-left: 0;
    content: '';
}

[clshortfuse]

There won't be any fractional numbers when we change checkbox's size to 18px in #8713. Currently, it's 20px which doesn't divide into whole numbers.

Edit: I will add though, that checkbox labels aren't supposed to be centered according to spec. They're supposed to align to the top. See https://material.google.com/components/text-fields.html#text-fields-single-line-text-field (picture on left)

[ThomasBurleson]

@clshortfuse - what is the PR #?

[clshortfuse]

@ThomasBurleson Sorry, was embedded in the text:

PR: #8713