Медиа-запрос меняет цвет фона Div, но не его ширину? - PullRequest
Новая
       124

Медиа-запрос меняет цвет фона Div, но не его ширину?

0 голосов
/ 14 июля 2020

Я уже искал и пробовал решения, но у меня ничего не вышло.

Мой div: 

 <div id="test" class="col-4">
            <a class="nav-link py-0" href="~/MyDevices/Index">
                <img src="~/Images/logo.png" width="75" />
                <strong class="h4 text-white">
                    Title is here for Application
                </strong>
                <span class="sr-only">(current)</span>
            </a>
        </div>

Название не работает на маленьком устройстве, но я вручную меняю его класс div на " col-6 "работает нормально. Я использую медиа-запрос, чтобы изменить col-4 на col-6, он не работает, но я могу изменить цвет фона div.

Мой медиа-запрос: 

@media (min-width: 768px) {
    #test  {
        width: 50% !important;
        background-color: aliceblue;
    }
}

мой медиа-запрос находится внутри bootstrap. css

если я использую .col в медиа-запросе после #test, то он не вызывает этот медиа-запрос без цвета BG.

Как изменить ширину div?

надеется на ответ

1 Ответ

1 голос
/ 14 июля 2020

Bootstrap 4 использует гибкость, поэтому, если вы используете это, вы должны изменить ширину на гибкость, как это 

@media (min-width: 768px) {
    #test  {
        flex: 50% !important;
        max-width: 50% !important;
        background-color: aliceblue;
    }
}

Но вы можете использовать bootstrap для этого, просто добавив col-md-6 в элемент 

 <div id="test" class="col-4 col-md-6">
...