1
0
mirror of https://github.com/jdan/98.css.git synced 2025-08-29 16:49:58 +02:00

fix radio and checkbox label positioning

This commit is contained in:
Jordan Scales
2020-04-23 13:57:07 -04:00
parent 6ccdbd0daa
commit 59a40ed9e8
3 changed files with 18 additions and 0 deletions

View File

@@ -265,6 +265,11 @@ input[type="checkbox"] {
border: none; border: none;
} }
input[type="radio"] + label,
input[type="checkbox"] + label {
line-height: 13px;
}
input[type="radio"] + label { input[type="radio"] + label {
position: relative; position: relative;
margin-left: 18px; margin-left: 18px;
@@ -273,6 +278,7 @@ input[type="radio"] + label {
input[type="radio"] + label::before { input[type="radio"] + label::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0;
left: -18px; left: -18px;
display: inline-block; display: inline-block;
width: 12px; width: 12px;

View File

@@ -265,6 +265,11 @@ input[type="checkbox"] {
border: none; border: none;
} }
input[type="radio"] + label,
input[type="checkbox"] + label {
line-height: 13px;
}
input[type="radio"] + label { input[type="radio"] + label {
position: relative; position: relative;
margin-left: 18px; margin-left: 18px;
@@ -273,6 +278,7 @@ input[type="radio"] + label {
input[type="radio"] + label::before { input[type="radio"] + label::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0;
left: -18px; left: -18px;
display: inline-block; display: inline-block;
width: 12px; width: 12px;

View File

@@ -257,6 +257,11 @@ input[type="checkbox"] {
border: none; border: none;
} }
input[type="radio"] + label,
input[type="checkbox"] + label {
line-height: 13px;
}
input[type="radio"] + label { input[type="radio"] + label {
position: relative; position: relative;
margin-left: var(--radio-total-width); margin-left: var(--radio-total-width);
@@ -265,6 +270,7 @@ input[type="radio"] + label {
input[type="radio"] + label::before { input[type="radio"] + label::before {
content: ""; content: "";
position: absolute; position: absolute;
top: 0;
left: calc(-1 * (var(--radio-total-width-precalc))); left: calc(-1 * (var(--radio-total-width-precalc)));
display: inline-block; display: inline-block;
width: var(--radio-width); width: var(--radio-width);