Change color border of a checkbox

Question

I must change the color of the border of a checkbox.

This is the image :change border checkbox

I sought and I sought on the Web but I didn't found how to do this :-(

Answer 1

Take a look at this JSFiddle which I stole from This answer on StackOverflow.

Here's the CSS:

.styled-checkbox {
   opacity: 0;
   filter: alpha(opacity=0);
}
.styled-checkbox + label {
   position: relative;
}
.styled-checkbox + label:before,
.lt-ie8 .checkbox-replacement {
   content: '';
   display: inline-block;
   visibility: visible;
   left: 0;
   width: 0.6em;
   height: 0.6em;
   margin: 0 0.3em 0 -1em;
   line-height: 0.6;
   text-align: center;
   border: 1px solid red;
 }
.styled-checkbox:checked + label:before,
.lt-ie9 .styled-checkbox.checked + label:before {
   content: '\2713';
 }