6. different checkbox style

  - accepted / - tried

The default checkbox style might not be what you want for most of the time, in this problem you are asked to create a different checkbox style.

  1. when unchecked, show a gray circle ('color: gray')
  2. when checked, show a green circle ('color: green')

Set the circle with radius of 5px and don't add extra padding, the HTML structure is

<label class="my-checkbox">
  <input type="checkbox" />
  <span>a checkbox</span>
</label>

1.unchecked

2.checked

(38)