Как обнулить или изменить отступ маркера в списке. По умолчанию отступ маркера уже задан, возможно ли его отменить с помощью padding или margin другим способом. Я решил через margin-left: -N px. Код ниже
html,
body {
margin: 0;
padding: 0;
}
.main-menu {
width: 250px;
margin: 10px;
padding: 0;
background: #3296ad;
list-style-position: inside;
}
.main-menu li {
padding: 10px 15px;
margin-bottom: -3px;
list-style-type: circle;
color: #ffffff;
border: 3px solid #b4e6e5;
}
.main-menu li a {
/* margin-left: -15px;*/
text-decoration: none;
color: #f5ffe7
}
Ответ
Есть еще такой вариант before
html,
body {
margin: 0;
padding: 0;
}
.main-menu {
width: 250px;
margin: 10px;
padding: 0;
background: #3296ad;
}
.main-menu li {
margin-bottom: -3px;
color: #ffffff;
border: 3px solid #b4e6e5;
padding: 10px 15px;
position: relative;
padding-left: 20px;
}
.main-menu li:before {
content: '';
list-style-type: circle;
display: list-item;
float: left;
width: 1px;
margin: 0 -10px 0 10px;
}
.main-menu li a {
text-decoration: none;
color: #f5ffe7;
}
Но тоже с отрицательным отступом, решение которое вполне приемлемое (как и Ваш margin-left: -15px;) !
Также из той серии, что и отрицательный отступ - это a {translateX(-15px); }
Комментариев нет:
Отправить комментарий