Проблема с медиа-запросами в шапке

0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 533 Просмотров
*

zeus07

  • Завсегдатай
  • *****
  • 638
  • 8
Здравствуйте!

Отверстал сайт: http://georg.artcolorit.com/

В шапке есть 2 картинки с орнаментами, которые сделаны при помощи псевдоклассов :before и :after. До 1366px по ширине ещё вполне сносно смотрится, а вот как настроить высоту этих орнаментов на более высоких разрешениях?

Прописывал через медиа-запросы через !important, но вообще иначе работает. Может кто-то сможет подсказать как это всё-таки реализовать?

Заранее благодарен.

*

AlekVolsk

  • Профи
  • ********
  • 6301
  • 336
Re: Проблема с медиа-запросами в шапке
« Ответ #1 : 06.04.2015, 18:40:47 »
Увеличиваем высоту и смещаем за границы шапки (для верхнего например top:-30px и bottom:-30px для нижнего).

*

zeus07

  • Завсегдатай
  • *****
  • 638
  • 8
Re: Проблема с медиа-запросами в шапке
« Ответ #2 : 06.04.2015, 18:45:26 »
Увеличиваем высоту и смещаем за границы шапки (для верхнего например top:-30px и bottom:-30px для нижнего).

Не, ну это понятно. Дело в том, что не работают стили почему-то. В данный момент прописаны стили для ширины 1366px:
Код
@media (max-width: 1366px) {
   .bg-header:before, .bg-header:after {
      height: 115px;
   }
}

Но на этом разрешении они почему-то не подхватываются.

*

AlekVolsk

  • Профи
  • ********
  • 6301
  • 336
Re: Проблема с медиа-запросами в шапке
« Ответ #3 : 06.04.2015, 18:58:56 »
@media (mix-width: 1367px) {
   .bg-header:before, .bg-header:after {
      height: 145px;
   }
   .bg-header:before {
      top: -30px;
   }
   .bg-header:after {
      bottom: -30px;
   }
}

*

zeus07

  • Завсегдатай
  • *****
  • 638
  • 8
Re: Проблема с медиа-запросами в шапке
« Ответ #4 : 06.04.2015, 19:12:40 »
Всё равно не подтягивается что-то стиль. Через Chrome смотрю