0

Всем привет. Решил ознакомиться с бутрапом и начал делать небольшой сайт. Наткнулся вроде на мелочь, но неприятно. Вообщем код навигационной панели:

<div class="collapse navbar-collapse" id="navbarResponsive">
            <ul class="navbar-nav ml-auto text-center">
                <li class="nav-item active">
                  <a class="nav-link" href="#">1</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">2</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">3</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">4</a>
                </li>
            </ul>
</div>

ml-auto для широких экранов выровнял навигацию по правому краю. В бургер меню при маленьких экранах она оказалась почему то слева. Добавил text-center и вроде выглядит неплохо. Но теперь решил добавить отступы между пунктами меню при большом экране.Кроме margin/padding не придумал как это можно сделать. Добавил, вроде не плохо, но теперь смотрю на бургер меню и по очевидным причинам там отступ слева тоже добавился и текст уже не в центре.Как можно по отдельности стилизовать навигацию для больших и маленьких экранов. Сори за воду, не знал как короче сформулировать. Возможно и так понятно, но на всякий приложу фото.

На широких экранах

на мобильных экранах

2
  • ...style='text-align:center;' ? 6 авг 2020 в 13:11
  • Пробовал, но margin не дает сдвинуться. В бутстрапе text-center наверное то же самое делает что и text-align:center.
    – Hi_TecH
    6 авг 2020 в 13:13

1 ответ 1

0

Попробуйте так, * замените на числовой значение

position: relative;
left: *px;
right: *px;
margin:0px auto!important;
padding:0px!important
3
  • Чтобы left/right работали разве не должно быть position:absolute?
    – Hi_TecH
    7 авг 2020 в 9:23
  • @Тимур не должно. Так работает
    – Arcadiy
    7 авг 2020 в 14:29
  • @Тимур relative - расслабленно, то-бишь позиция не привязана и ею так же можно управлять
    – Arcadiy
    7 авг 2020 в 14:36

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.