Горизонтальное меню [20.18] Вопрос

Курсы §13. Мастерская: создаём меню
1

.main-menu{
background-color: #2980b0;
padding: 0;
margin: 0;
}

.main-menu li{
padding: 10px 5px;
display: inline-block;
border-left: 2px solid #2c3e50;
}

.main-menu a{
color: #ffffff;
text-decoration: none;
padding: 10px 10px;
}

.active{
background-color: #1abc9c;
}

2
2.png657×571 22.4 KB

Вопросы: за счет чего отклоняется текст и почему рамка отклоняется в ячейке “Участники”.

2

Размеры пунктов меню li у вас меньше, чем размеры ссылок. Отсюда и проблемы.

3

Ничего не меняется, если указать одинаковые паддинги у li и a, ничего не меняется если сделать паддинг для а меньше.

4

Потому что ссылка у вас не является блочным элементом.