Мастерская: создаём меню / Оформляем состояния пунктов [9/28]

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

Снимок экрана 2015-10-06 в 14.02.19.png2142×1372 258 KB

Ну что у меня не так?

2

Загляните в «Различия», там будет видно :wink:

3

заглядывала, не пойму как исправить:pensive:

Снимок экрана 2015-10-06 в 14.15.15.png1026×712 59.6 KB

4

А скиньте код текстом, пожалуйста.

5 
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 {
   padding: 0;
   margin: 0;
   width: 200px;   
   list-style: none;
}
.main-menu a {
  display: block;
  padding: 10px 15px;
  text-decoration: none;
  color: #FFFFFF;
  background-color: #2980B9;
  border-bottom: 2px solid black;
}
.main-menu .active a {
   background-color: #1ABC9C;
  border-bottom: 2px solid #2ECC71; 
  
}
.main-menu a:hover {
    background-color: #2ECC71;
}

<body>
        <ul class="main-menu">
        <li><a href="#courses">Курсы</a></li>
        <li class="active"><a href="#demo">Демонстрации</a></li>
        <li><a href="#member">Участники</a></li>
        <li><a href="#progress">Достижения</a></li>
        <li><a href="#profile">Профиль</a></li>
        </ul>
    </body>
6 
    <ul class="main-menu">
    <li><a href="#courses">Курсы</a></li>
    <li class="active"><a href="#demo">Демонстрации</a></li>
    <li><a href="#member">Участники</a></li>
    <li><a href="#progress">Достижения</a></li>
    <li><a href="#profile">Профиль</a></li>
    </ul>
7

У вас нижние рамки непраивльного цвета. Нужно #2C3E50 (в теории есть).

1 лайк
8

вот это да!!!
никогда бы не догадалась, спасибо:)