Испытание 28/28 100% может что-то не так, но 100%

Курсы §13. Мастерская: создаём меню
1 
<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <title>Испытание: выпадающее меню</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <ul class="main-menu">
      <li>
        <a href="/intensive">Интенсивы</a>
      </li>
      <li class="open">
        <a href="/courses">Курсы</a>
        <ul class="sub-menu">
          <li>
            <a href="/courses/4">Знакомство</a>
          </li>
          <li>
            <a href="/courses/42">Селекторы</a>
          </li>
          <li>
            <a href="/courses/45">Позиционирование</a>
          </li>
        </ul>
      </li>
      <li>
        <a href="/profession/frontender">Профессия</a>
      </li>
      <li>
        <a href="/pricing">Подписка</a>
      </li>
      <li>
        <a href="/profile">Профиль</a>
      </li>
    </ul>
  </body>
</html>
html,
body {
  margin: 0;
  padding: 0;
}

body {
  width: 380px;
  min-height: 280px;
  padding: 10px;

  font-size: 14px;
  line-height: 1.4;
  font-family: "Arial", sans-serif;

  background-color: #ecf0f1;
}

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

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

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

.main-menu > li {
  position: relative;  
}

.main-menu .sub-menu {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0px;
  left: 180px;
  z-index: 10;
  list-style: none;
  width: 200px;
}

.main-menu .sub-menu a {
  
  border-bottom: 2px solid #2ecc71;  
}
2

Всё как у всех: никто не делает “живое” меню.

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

body {
    width: 380px;
    min-height: 280px;
    padding: 10px;
    font-family: "Arial", sans-serif;
    font-size: 14px;
    line-height: 1.4;
    background: #ecf0f1;
}

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

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

.main-menu .open > a {
   /* background: #1abc9c;  /*раскомментировать для прохождения испытания*/
}

.main-menu .sub-menu {
    display: none;      /*закомментировать для прохождения испытания*/
    position: absolute;
    top: 0px;
    left: 180px;
    z-index: 10;
}

.main-menu .sub-menu a {
    background: #1abc9c;
    border-bottom: 2px solid #2ecc71;
}

.main-menu > li > a:hover {
    background: #1abc9c;
}
.main-menu li:hover .sub-menu {
    display: block;    
}

.main-menu .sub-menu a:hover {
    background: #2ecc71;
}
3

Да я был невнимателен что нужно делать выпадающее меню при наведении, и так переделал немного код

body {
      min-width: 300px;
      padding: 10px;
      font-size: 14px;
      line-height: 1.4;
      font-family: "Arial", sans-serif;
    }

    .main-menu {
      margin: 0;
      padding: 0;
      list-style: none;
      border: 1px solid #e5e5e5;
    }

    .main-menu > li {
      position: relative;
      display: inline-block;
      margin-right: -4px;
    }

    .main-menu a {
      display: block;
      margin-left: -1px;
      padding: 8px 10px;
      color: #0088cc;
      border-left: 1px solid #e5e5e5;
    }

    .main-menu a:hover {
      background-color: #f5f5f5;
    }

    .main-menu .sub-menu {
      position: absolute;
      left: 1px;
      width: 150px;
      margin: 0;
      padding: 0;
      list-style: none;
      background-color: #fcf8e3;
    }

    .main-menu .sub-menu a {
      margin-bottom: -1px;
      border: 1px solid #e5e5e5;
    }

    .sub-menu {
      display: none;
      }

    .main-menu > li:hover .sub-menu {
      display: block;
    }
4

…это к какому испытанию?

5

Сборная солянка…)

6

Что не так? пишет 97%, не знаю что еще изменить

2020-06-28 (63)
2020-06-28 (63)1920×1080 171 KB

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

body {
width: 380px;
min-height: 280px;
padding: 10px;
font-size: 14px;
line-height: 1.4;
font-family: “Arial”, sans-serif;
background-color: #ecf0f1;
}

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

.main-menu a {
display: block;
padding: 10px 15px;
margin-bottom: -1px;
color: #ffffff;
background-color:#2980b9;
text-decoration: none;
}

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

.main-menu > li {
position: relative;
display: block;
border-bottom: 3px solid #2c3e50;
}

.main-menu .sub-menu {
position: absolute;
top: 0px;
left: 180px;
z-index: 10;
width: 200px;
margin: 0;
padding: 0;
list-style: none;
background-color:#1abc9c;
}

.main-menu .sub-menu a {
background:#1abc9c;
padding-left: 15px;
border-bottom: 3px solid #2ecc71;
}

.main-menu .open .sub-menu {
display:block;
}

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