html < /strong> < /p>
Код: Выделить всё
L
M
W
J
V
< /code>
css < /strong> < /p>
/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
position: absolute!important;
left: -9999px!important;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
position: relative;
padding-left: 40px;
padding-top:6px;
margin-bottom:20px;
cursor: pointer;
font-family:'arial';
}
/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
content: '';
position: absolute;
left:0; top: 0;
width: 32px; height: 32px;
border: 1px solid #ccc;
background: #fff;
border-radius: 3px;
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
content: ' ';
background:#ccc;
width:20px;
height:20px;
border-radius:3px;
position: absolute;
top: 6px; left: 6px;
font-size: 24px;
line-height: 0.8;
color: #000;
transition: all .2s;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
opacity: 0;
transform: scale(0);
}
[type="checkbox"]:checked + label:after {
opacity: 1;
transform: scale(1);
}
.checkbox-inline{display:inline-block;}
.weekday{text-indent:-29px; margin-right:60px; font-weight:bold; }
.weekday::before{background:none!important;}
.weekday::after{z-index:-1;}
< /code>
Результаты < /strong> < /p>
< /p>
Я не знаю, как и в центре. Как вы можете видеть, все буквы, кроме M Я пробовал много font-family < /code> и ничего, что все еще имея это смещение. Любой типография гуру, который может объяснить, почему эти двое действуют по-разному?>
Подробнее здесь: https://stackoverflow.com/questions/346 ... er-letters
Мобильная версия