Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stray line on checkbox on IE #518

Closed
davidread opened this issue Jul 10, 2017 · 5 comments
Closed

Stray line on checkbox on IE #518

davidread opened this issue Jul 10, 2017 · 5 comments
Assignees

Comments

@davidread
Copy link

davidread commented Jul 10, 2017

A ticked checkbox has a stray hairline. See:
screen shot 2017-07-10 at 12 57 48

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).

@davidread davidread changed the title Stray line on checkbox on IE11 Stray line on checkbox on IE Jul 10, 2017
@alex-ju
Copy link
Contributor

alex-ju commented Jul 10, 2017

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
Copy link
Author

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
Copy link
Contributor

Thanks @alex-ju! 💯

Can you please open a pull request for this fix.

NickColley added a commit that referenced this issue Jul 10, 2017
Fix #518: stray line on checkbox on IE11
@NickColley NickColley reopened this Jul 10, 2017
@NickColley
Copy link
Contributor

Reopening until we get a release out

@gemmaleigh
Copy link
Contributor

Released in v3.1.1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants