@yoyoyooyoyoyoyoyoyoyoyoyo

Как сделать подменю на всю ширину контейнера?

Добрый день. Подскажите, пожалуйста, как сделать горизонтальное подменю на всю ширину контейнера ?

Пробовал решить эту задачу через
.dropdown-menu {
	width: 100%;
	max-width: 1140px;
text-align: center;
left: 0%;
right: 0%;
top: auto;
position: fixed;
margin: 0 auto;
}

Выглядит так. как надо, но из-за фикседа меню страдает, если находится слегка прокрученным.

В подменю будет 4-5 столбцов.

Я так понимаю, что работать надо с этой частью кода, но уже все перепробовал...
<div class="dropdown-menu">
            <div class="dropdown-inner">
              <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
              <ul class="list-unstyled">
                <?php foreach ($children as $child) { ?>
                <li class="drop-dva"><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
                <?php } ?>
              </ul>
              <?php } ?>
            </div>
             </div>


Делаю на стандартном шаблоне ocstore 2.3
  • Вопрос задан
  • 94 просмотра
Пригласить эксперта
Ответы на вопрос 1
kartovitskii
@kartovitskii
Fullstack
Для начала первое, что бросается в глаза: left: 0% перекрывает right: 0%, избыточное свойство.

Во-вторых, пример:

<!-- Условный родительский контейнер .container -->
<div class="container">
    <!-- Список с элементами меню ul -->
    <ul>
        <li>
            <a href="#">Ссылка 1</a>
        </li>
        <li>
            <a href="#">Ссылка 2</a>
        </li>
        <li>
            <a href="#">Ссылка 3</a>
        </li>
    </ul>
</div>

<style>
    .container ul {
        display: block;
        height: 60px;
        line-height: 60px;
        background: #ededed;
    }
    .container ul li {
        display: inline-block;
        list-style-type: none;
        padding: 0 20px;
    }
</style>


В-третьих, как по мне, в вашем вопросе крайне недостаточно входных данных, поэтому ответ построен частично на догадках о том, что требуется.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы