javascript - css checkbox checked material design overlay -
i'm trying fancy material design checkboxes got stuck @ applying overlay when checkboxes checked. here example of have done far: http://codepen.io/stefancenusa/pen/rvwebb
input[type="checkbox"]:checked + label { /*what should write here?*/ }
what intend do: after checkbox clicked, i'd white overlay tick in center appear on colored circle.
is possible? how can achieve that?
thank you!
i gave shot. hope helps.
input[type="checkbox"]:checked + label:before { content: '✓'; font-size: 2em; line-height: 53px; text-align: center; display: block; position: absolute; width: 53px; height: 53px; top: 0; left: 0; color: #fff; }
update: tweaked little..
you can set cool icon replace text, other font or background-image
.
Comments
Post a Comment