Fix positioning of checkbox checkmark
Changing the ::after element to be displayed as 'block' lets it be positioned using relative. This means we can remove the confusing "position: relative" from the checkbox.
This commit is contained in:
parent
3553a451d8
commit
5b7d2a622e
|
@ -86,13 +86,13 @@ option {
|
|||
* Checkboxes
|
||||
*/
|
||||
input[type=checkbox] {
|
||||
position: relative;
|
||||
background-color: white;
|
||||
background-image: unset;
|
||||
border: 1px solid dimgrey;
|
||||
border-radius: 3px;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
padding: 0;
|
||||
margin-right: 6px;
|
||||
vertical-align: bottom;
|
||||
transition: 0.2s background-color linear;
|
||||
|
@ -103,7 +103,8 @@ input[type=checkbox]:checked {
|
|||
}
|
||||
input[type=checkbox]:checked::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block; /* width & height doesn't work on inline elements */
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 3px;
|
||||
width: 3px;
|
||||
|
|
Loading…
Reference in New Issue