Stray line on checkbox on IE

[davidread]

A ticked checkbox has a stray hairline. See:

As viewed here: https://govuk-elements.herokuapp.com/form-elements/#form-checkboxes on a VM running Windows 7, IE11(Edge) on OSX (Retina). Also seen on IE9 &IE10 emulation (from Edge's dev tools).

[alex-ju]

It seems to be a bug caused by the transform rotate (-45deg). A quick fix might be setting the border to inset or transparent

.multiple-choice [type=checkbox] + label::after {
  border-top-style: inset;
}

or

.multiple-choice [type=checkbox] + label::after {
  border-top-color: transparent;
}

[davidread]

Thanks @alex-ju both these do it for my project - much appreciated.

I'm afraid I'm not familiar with this repo, nor have my VM set-up to test a local server, so can't provide a PR for this (govuk_elements repo).

[gemmaleigh]

Thanks @alex-ju! 💯

Can you please open a pull request for this fix.

[NickColley]

Reopening until we get a release out

[gemmaleigh]

Released in v3.1.1