Испытание: вертикальное меню [9/28] 97% , браузер не правильно показывает рамки.

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

html,
body {
margin: 0;
padding: 0;
}

body {
width: 280px;
min-height: 280px;
padding: 10px;
font-family: “Arial”, sans-serif;
font-size: 14px;
line-height: 1.4;
background: #ecf0f1;
}
.main-menu {
width:200px;
margin-left:-40px;
}
.main-menu li {
display:block;
padding:10px 15px;
list-style:none;
border-bottom:2px solid black;
color:#ffffff;
background-color:#2980b9;
}
.main-menu li:nth-child(2) {
background-color:#1abc9c;
border-bottom:2px solid #2ecc71;
}

В сравнении отличаются только нижние рамки, в моем минибраузере они тонкие, внизу наоборот толстые.

2

В вашем коде я не вижу стилей для ссылок, могу предположить, что в разметке их нет.
Отрицательный отступ зачем вам понадобился?
Будьте внимательны, все используемые цвета даны в теории к заданию. Рамки у пунктов меню в образце не черные.

3

Ссылок в разметке нет, думал они и не нужны. А отрицательного отступа у меня нет, не знаю где вы его увидили)
Дурацкая ошибка, поменял цвет нижних рамок - теперь 100%, спасибо!

4

</></>

5

Точно, я просто подумал, речь идет об отступе нижней рамки. А как тогда сделать, чтобы менюшка стала на нужное место? Я пробовал и спозиционировать абсолютно или относительно, но там тоже нужны отрицательные отступы в свойстве left: И в боди падинги убрал, все равно менюшка стоит справа.

6

Отступы у списка меню почему не сбрасываете (не обнуляете)?

7

Я попробовал обнулить отступы (margin) везде где только мог, единственное что меняется - отступы сверху, список становится ближе к верхнему краю, а справа как было расстояние, так и остается!

8

А padding?