How to change checkbox's border style in CSS?

Solution 1:

I suggest using "outline" instead of "border". For example: outline: 1px solid #1e5180.

Solution 2:

You should use

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

Then you get rid of the default checkbox image/style and can style it. Anyway a border will still be there in Firefox

Solution 3:

If something happens in any browser I'd be surprised. This is one of those outstanding form elements that browsers tend not to let you style that much, and that people usually try to replace with javascript so they can style/code something to look and act like a checkbox.