15/28. Оцените, пожалуйста, код

.main-menu {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 200px;
}

.main-menu > li > a {
    display: block;
    background-color: #2980b9;
    padding: 10px 15px;
    text-decoration: none;
    color: #ffffff;
    border-bottom: 2px solid #2c3e50;
}

.main-menu > .active > a {
    background-color: #1abc9c;
}

.main-menu li ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
    

.main-menu li li a {
    color: #2980b9;
    display: block;
    padding-top: 10px;
    padding-left: 15px;
    background-color: #ffffff;
}

.main-menu li li:first-child a {
    padding-top: 15px;
}

.main-menu li li:last-child a {
    padding-bottom: 15px;
    border-bottom: 2px solid #2c3e50;
}

Просмотрел несколько раз, вроде ок. Есть ли тут неоптимизированности?

И еще один вопрос по этой же теме. В испытании 20/28 создал, 100% ок. Но возник вопрос:

.main-menu {
    padding: 0;
    margin: 0;
    list-style: none;
}

.main-menu li {
    display: inline-block;
}

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


.main-menu li a {
    display: block;
    text-decoration: none;
    padding: 10px 15px;
    background-color: #2980b9;
    color: #ffffff;
    border-left: 2px solid #2c3e50;
    margin-right: -5px;
}

Почему последний блок достижения не растягивается до конца строки?
Он же должен вести себя как блок внутри inline-block? Да, я ему задал ширину и он выравнялся, как нужно для задания (хотя ширина была 131px, что тоже мимо условия). Но вопрос повис.

Хороший код вроде ничего лишнего. А по вашему вопросы увы не разобрался)

Да вот в 20/28 последний блок горизонтального меню “достижения”" почему-то ведет себя не как блок, а как инлайн-блок. Я ожидал, что он, как блок, растянется по всей оставшейся ширине.

Ну да вы совершено правы.

хмм… дык что ж ему от меня то надо, чтоб потянуться?:grinning:

проблема решается заданием аналогичного background у main-menu. немного странное поведение в данном случае

Это выход… но ответ не получен, почему он себя так ведет)