0

I'm having trouble fixing one issue with checkbox on IOS browsers. I always get a black check icon with a black square around it (picture). This only happens on IOS browsers.

I'm using

 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none; 

Any ideas? Anyone had the same problem?

enter image description here

1
  • 1
    Please share your code (HTML, CSS)
    – Sebastian
    Feb 15, 2017 at 8:24

3 Answers 3

1

I tried several ways to fix it, but in the end I tried one simple thing and it worked... I change the SVG that I was using. Just added white background on the SVG image and it worked!

Thanks for the help anyways :)

0

Shot in the dark, since I can't access and play with your code, but try doing:

input[type='checkbox']:checked {
  -webkit-appearance: none;
}

Might work, idk. If not, some source code would be nice.

0
input[type='checkbox'] {
    background-color: transparent;
}

Setting background-color to transparent solved this for me.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.