Автоматическая подгонка ширины navtab в bootstrap 4 после изменения размера браузера - PullRequest
0 голосов
/ 03 октября 2018

Поскольку я новичок в font-end, использую начальную загрузку 4 с угловым 6. У меня есть навигационные метки внутри моей сетки:

<div class="col-md-2 col-sm-2 col-xl-2 col-lg-2">
    <ul class="nav nav-tabs ">
        <li class="nav-item">
            <a class="nav-link">Menu 1</a>
        </li>
        <li class="nav-item">
            <a class="nav-link">Menu 2</a>
        </li>
        <li class="nav-item">
            <a class="nav-link">Menu 3</a>
        </li>
      </ul>
</div>

Изображение для кода выше

Я просто хочу, чтобы ширина вкладки меню автоматически помещалась внутри столбца начальной загрузки при изменении размера экрана.Не могли бы вы, ребята, помочь мне с этим.

Заранее спасибо!

1 Ответ

0 голосов
/ 03 октября 2018

Если вы хотите изменить, сколько места вы хотите занять столбцу, вы должны настроить каждый класс столбца в зависимости от размера вашего окна.Похоже, вы находитесь на очень маленьком устройстве, поэтому вы должны добавить столбец xs.И настроить с размером 12, так как это 100% пространства.

<div class="col-xs-12 col-md-2 col-sm-2 col-xl-2 col-lg-2">
<ul class="nav nav-tabs">
    <li class="nav-item">
        <a class="nav-link">Menu 1</a>
    </li>
    <li class="nav-item">
        <a class="nav-link">Menu 2</a>
    </li>
    <li class="nav-item">
        <a class="nav-link">Menu 3</a>
    </li>
  </ul>

...