Bootstrap 3 горизонтальный dl: как изменить ширину dt? - PullRequest
Новая
       9

Bootstrap 3 горизонтальный dl: как изменить ширину dt?

0 голосов
/ 10 июня 2018

Я использую горизонтальные списки определений Bootstrap, с некоторыми изменениями.

Мой dt должен быть выровнен по левому краю, и, поскольку я знаю ширину содержимого, которое там идет, я уменьшаю его спо умолчанию.Вот правила SCSS, которые я применяю: 

dl.dl-horizontal {
  dt {
    width: 120px;
    text-align: left;
  }
  dd {
    margin-left: 135px;
  }
}

Это прекрасно работает, пока я не доберусь до небольших устройств.В этих видовых экранах я вижу, что Bootstrap устанавливает для левого поля dd значение 0. Вот моя попытка: 

@media only screen and (max-width: 768px) {
  dl.dl-horizontal dd {
    margin-left: 0;
  }
}

Но это не вступает в силу.

В консоли браузера я вижу, что медиа-запрос был применен к dd, но он был переопределен правилом не-медиа-запроса.Насколько я вижу, специфика обоих правил идентична, и я попытался найти медиа-запрос как выше, так и ниже правила не-медиа-запроса.

1 Ответ

0 голосов
/ 10 июня 2018

Попробуйте добавить! Важный тег в ваш код SCSS. 

@media only screen and (max-width: 768px) {
  dl.dl-horizontal dd {
    margin-left: 0 !important;
  }
}

Надеюсь, это поможет!

...