Как поменять цвет шрифта, хотя указана в стилях

Question

Я являюсь новичком, поэтому прошу строго не судить:) Проблема заключается в следующем:Цвет шрифта белый, а всплывающего окна черный, но цвет остается белым. Пожалуйста можете указать на ошибку, которую я допустил

.nav__links {
  display: flex;
  justify-content: space-between;
  width: 50%;
  margin: 0;
  align-items: center;
  text-decoration: none;
}

.nav__links > li,
.nav__links > a {
  display: inline-block;
}

.nav__links a {
  text-decoration: none;
  color: #fff;
  display: block;
  padding: 10px 1.5rem;
  list-style: none;
}

.nav__links a:hover {
  color: #ed2840;
  transition: color 0.22s ease;
}

.submenu {
  position: absolute;
  background-color: #fff;
  padding: 0;
  color: #000;
  width: 340px;
  left: 0;
  list-style: none;
  display: none;
}

.submenu2 {
  position: absolute;
  left: 100%;
  width: 340px;
  top: 0;
  color: #000;
  background-color: #fff;
  list-style: none;
  display: none;
}

.nav__links li:hover > .submenu {
  display: block;
}

.submenu li:hover > .submenu2 {
  display: block;
}

<!DOCTYPE html>
<html>
 <head>
   <title>!DOCTYPE</title>
   <meta charset="utf-8">
   <link href="./style.css" rel="stylesheet" type="text/css">
 </head>
 <body>
<ul class="nav__links">
      <li>
        <a href=" #">Федерации</a>
        <ul class="submenu">
          <li>
            <a href=" #">Национальные виды спорта</a>
            <ul class="submenu2">
              <li>
                <a href=" #">Курош</a>
              </li>
              <li>
                <a href=" #">Конные скачки</a>
              </li>
              <li>
                <a href=" #">Кок-Бору</a>
              </li>
              <li>
                <a href=" #">Кулатуу</a>
              </li>
              <li>
                <a href=" #">Национальная классическая борьба</a>
              </li>
              <li>
                <a href=" #">Ордо</a>
              </li>
              <li>
                <a href=" #">Салбуурун</a>
              </li>
              <li>
                <a href=" #">Тогуз коргоол</a>
              </li>
              <li>
                <a href=" #">Эр эниш</a>
              </li>
            </ul>
          </li>
          <li>
            <a href=" #">Олимпийские виды спорта</a>
          </li>
          <li>
            <a href=" #">Неолимпийские виды спорта</a>
          </li>
          <li>
            <a href=" #">Виды спортов Пара и Сурдо (ЛОВЗ)</a>
          </li>
        </ul>
      </li>
 </body> 
</html>

Answer 1

Я тоже не до конца понял ваш вопрос, но:

className нужно заменить на class
В классе submenu поменять color и background-color местами

Answer 2

.submenu {
  position: absolute;
  background-color: #fff;
  padding: 0;
  color: #000!important;
  width: 340px;
  left: 0;
  list-style: none;
  display: none;
}

.submenu2 {
  position: absolute;
  left: 100%;
  width: 340px;
  top: 0;
  color: #000!important;
  background-color: #fff;
  list-style: none;
  display: none;
}

БЛОГ НА HUSL

Как поменять цвет шрифта, хотя указана в стилях

Ответы (2 шт):