Приоритет своего CSS над bootstrap

  • Uriy Nikolaevich

    (@uriy-nikolaevich)


    4 года, 8 месяцев назад

    Добрый день! Подскажите как свой CSS в Customizer темы преобладал над bootstrap
    Есть такой 

    @media (min-width: 769px)
bootstrap.m…er=1.0.2:14
.navbar-collapse.collapse {
1.	     display: block !important;
2.	     height: auto !important;
3.	     padding-bottom: 0;
4.	     overflow: visible !important;
}

    Как сдедать свой CSS/ Вставляю в дополнительные стили 

    @media screen and (min-width: 869px) {
.navbar-collapse.collapse {
    display:block! important;   
   
	} }

    Но не срабатывает. Тема hestya

Просмотр 3 ответов — с 1 по 3 (всего 3)
  • dallynx

    (@dallynx)

    4 года, 8 месяцев назад

    Дополнительные стили должны, как будто бы, работать. Неточно записано значение свойства display. Должно быть так: display: block !important;. И само правило бессмысленно — свойство display приобретает значение block, начиная с разрешения в 769px. Повторять это правило для разрешения 869px излишне.

    Автор Uriy Nikolaevich

    (@uriy-nikolaevich)

    4 года, 8 месяцев назад

    Спасибо за ответ. А как тогда, что бы это правило наситупило при 869 px?

    dallynx

    (@dallynx)

    4 года, 8 месяцев назад

    Как-то так, наверное:

    
@media (min-width: 769px) and (max-width: 869px){
  .navbar-collapse.collapse {
    display: none !important;
  }
}

    Однако, если Вы хотите, чтобы мобильное меню превращалось в десктопное, начиная с разрешения в 869px, а не в 769px, то код будет чуть сложнее. Набросал вариант, но не знаю сработает ли (pastebin). Может быть еще и от настроек темы зависит.

Просмотр 3 ответов — с 1 по 3 (всего 3)
  • Тема «Приоритет своего CSS над bootstrap» закрыта для новых ответов.