maksell
@maksell

Как выровнять блок по центру?

<div class="row mb-4">
            <ul class="nav category ml-auto mr-auto">
            {% for category in all_category %}
                <li class="nav-item ">
                    <div class="dropdown _megaMenu">
                        <button class="btn  dropdown-toggle " style= "display: block" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            {{category}}
                        </button>
                        <div class="dropdown-menu mega">
                            <div class="container-field">
                                <div class="row justify-content-center">
                                    {% for topic in category.topic.all %}
                                        <div class="col-2 ml-2">
                                            <a class="dropdown-item font-weight-bolder" >{{topic}}</a>
                                            {% for menu in all_menu %}
                                                {% if menu.topic == topic and menu.category == category %}
                                                    <a class="dropdown-item" href="/{{category.slug}}/{{menu.slug}}">{{menu.title}}</a>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
            {% endfor %}
            </ul> 
            <form action ="{% url 'search' %}" >
                <div class="search d-flex">
                    <input class="form-control border-right-0 border " type="search" value="{{search}}" placeholder="Искать товары", name="search">
                    <span class="input-group-append">
                        <div class="input-group-text bg-transparent p-0">
                        </div>
                        <button class="btn btn-outline-success " type="submit"><i class="fa fa-search"></i></button>
                    </span>
                </div>
            </form>
        </div>


5dc81739ce761202384788.jpeg

Ребят, подскажите плиз как выровнять категории по центру, у меня получилось только так
  • Вопрос задан
  • 42 просмотра
Решения вопроса 1
maksell
@maksell Автор вопроса
<div class="row justify-content-center mb-4">
            <ul class="nav category ml-auto mr-auto">
            {% for category in all_category %}
                <li class="nav-item ">
                    <div class="dropdown _megaMenu">
                        <button class="btn  dropdown-toggle " style= "display: block" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            {{category}}
                        </button>
                        <div class="dropdown-menu mega">
                            <div class="container-field">
                                <div class="row justify-content-center">
                                    {% for topic in category.topic.all %}
                                        <div class="col-2 ml-2">
                                            <a class="dropdown-item font-weight-bolder" >{{topic}}</a>
                                            {% for menu in all_menu %}
                                                {% if menu.topic == topic and menu.category == category %}
                                                    <a class="dropdown-item" href="/{{category.slug}}/{{menu.slug}}">{{menu.title}}</a>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                </li>
            {% endfor %}
                <li class="nav-item search ">
                    <form class="d-flex" action ="{% url 'search' %}" >
                        <input class="form-control border-right-0 border " type="search" value="{{search}}" placeholder="Искать товары", name="search">
                        <button class="btn btn-outline-success " type="submit"><i class="fa fa-search"></i></button>
                    </form>
                </li>
            </ul>
        </div>


.nav-item.search{
    position: absolute;
    right: 0;
}


Вот это сработало
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Sveak Барнаул
от 50 000 руб.
НТЦ РОСТ Москва
от 150 000 до 250 000 руб.
AUTEP Москва
от 100 000 до 200 000 руб.
15 нояб. 2019, в 01:36
10000 руб./за проект
15 нояб. 2019, в 01:32
5000 руб./за проект