Страницы

Поиск по вопросам

вторник, 27 ноября 2018 г.

Как обнулить отступ маркера в списке?

Как обнулить или изменить отступ маркера в списке. По умолчанию отступ маркера уже задан, возможно ли его отменить с помощью 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 } Menu



Ответ

Есть еще такой вариант 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); }

Комментариев нет:

Отправить комментарий