Не могу стиль ul список (bootstrap 4, WordPress тема)

Question

В настоящее время я сталкиваюсь с этой досадной проблемой: я не могу оформить список ul.Я попробовал несколько вещей;например, используя # вместо.при нацеливании на «социальный» класс.Не сработало

Вот мой код:

html:

<div class="header-information">
    <div class="socials">
    <?php
        $args = array(
            'theme_location' =>   'social-menu',
            'container'       =>        'nav',
            'container_class' => 'socials',
            'container_id' => 'socials',
            'link_before' => '<span class="sr-text">',
            'link_after'  => '</span>'
        );

        wp_nav_menu($args);
    ?>
    </div> <!--.socials-->
    <div class="address">
        <p>8000 Zürich, Teststrasse 12 </p>
        <p>Telefonnummer: +410 000 00 00 </p>
    </div>
</div><!--.header-information-->

css:

.socials.nav ul {
    list-style: none;
    text-align: center;
    padding: 0;
}

@media only screen and (min-width: 768px) {
    nav.socials ul {
        float: right;
    }
}

nav.socials ul li a:before {
    font-family: 'Font Awesome 5 Brands';
    display: inline-block;
    vertical-align: top;
    padding: 0 5px;
    content: '\f6af';
    font-size: 30px;
}

Answer 1

Если ваша структура меню такая,

<div class="header-information">
  <div class="socials">
  <nav>
    <ul>
      <li>One</li>
      <li>Two</li>
      <li>Three</li>
      <li>Four</li>
      <li>Five</li>
    </ul>
  </nav>
</div>

Тогда у вас возникла проблема с вашим селектором.

Эта строка ниже,

.socials.nav ul{

Это должно быть,

.socials nav ul {

Потому что nav не класс a, а элемент.

Надеюсь, это поможет.Приветствия