Элементы li не реагируют на CSS свойства, что делать?

Question

Nikita Juzz @Nikita0802

Student

HTML
CSS

Элементы li не реагируют на CSS свойства, что делать?

Изучаю вёрстку по видео из интернета и столкнулся с проблемой, элементы li никак не видоизменяются, но при этом код элемента показывает, что он видит все свойства.

Это часть кода, по задумке из "services" в будущем должны выпадать элементы ниже, и в данный момент я просто хочу спрятать элементы "class=drop-down_list"

<li class="header__drop-down drop-down">
                            <a href="#">
                                Services
                            </a>
                            <ui class="drop-down__list">
                        <li><a href="#">Web Design</a></li>
                        <li><a href="#">Wordpress Design</a></li>
                        <li><a href="#">Mobile App Devplopment</a></li>
                        <li><a href="#">Internet Marketing</a></li>
                        <li><a href="#">Social Media Management</a></li>
                    </ui>
                    </li>

Вот так

.drop-down__list {
    display: none;
}

Но эти элементы ни на что не реагируют, пытался и "Background color" и "display flex" накинуть, чтобы проверить из-за чего проблема, но они ни на что не реагируют, ни на одну команду. Подскажите в чём может быть ошибка пожалуйста.
Вот код целиком если надо

<body>
    <header class="header">
        <div class="conteiner">
            <div class="header__inner">
                <div class="header__logo">
                    <a href="#">
                        <span>Bis</span>Lite
                    </a>
                </div>
                <nav class="header__menu">
                    <ui>
                        <li>
                            <a href="#">
                                Home
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                About Us
                            </a>
                        </li>
                        <li class="header__drop-down drop-down">
                            <a href="#">
                                Services
                            </a>
                            <ui class="drop-down__list">
                        <li><a href="#">Web Design</a></li>
                        <li><a href="#">Wordpress Design</a></li>
                        <li><a href="#">Mobile App Devplopment</a></li>
                        <li><a href="#">Internet Marketing</a></li>
                        <li><a href="#">Social Media Management</a></li>
                    </ui>
                    </li>
                    <li>
                        <a href="#">
                            Portfolio
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Blog
                        </a>
                    </li>
                    <li><a href="#">
                            Contact Us
                        </a>
                    </li>
                    </ui>
                </nav>
            </div>
        </div>
    </header>
</body>

И CSS

html {
    box-sizing: border-box;
}

*,
*::before,
*::after {
    box-sizing: inherit;
}

a {
    color: #000;
    display: inline-block;
    text-decoration: none;
}

ui {
    list-style: none;
    margin: 0;
    padding: 0;
}

li {
    display: inline-block;
}

.conteiner {
    max-width: 1030px;
    margin: 0 auto;
    padding: 0px 15px;
}

.header {
    background-color: #e8ebf1;
}

.header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 120px;
}

.header__logo a {
    color: #2aacc8;
    font-size: 50px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
}

.header__logo span {
    color: #000;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
}

.header__menu {
    margin-right: 20px;
}

.header__menu li+li {
    margin-left: 50px;
}

.header__menu a {
    font-family: arial, sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
}

.drop-down__list {
    display: none;
}

Вот так это выглядит