Не работает @media запрос
274
11 ноября 2018, 03:10
Есть код, хочу добавить медиа-запрос с разрешением 992px. Смотрю через инспектор кода, но все как было, так и есть - стили медиа не применились. Помогите, в чем дело?
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="css/main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=PT+Sans:400,700|Roboto:400,700" rel="stylesheet">
<title>Layout</title>
</head>
<body>
<div class="logo">
<a href=""><img src="img/logo.png" alt="" class="header_logo"></a>
</div>
<style>
.logo {
padding-top: 52px;
}
@media screen and (max-width: 992px) {
.logo {
display: block;
margin: 0 auto;
}
}
</style>
<!--мой код-->
</body>
Answer 1
Все работает
.logo {
display: inline-block;
background: #000;
height: 40px;
width: 150px;
color: #fff;
}
.logo:after {
content: 'Больше 992px';
display: inline-block;
}
@media screen and (max-width: 992px) {
.logo {
background: #00f;
}
.logo:after {
content: 'Меньше 992px';
}
}<div class="logo"></div>Answer 2
А сам @media под нужным тегом виден в console? Если виден, но не применяется то, попробуй !important проставить, а лучше конечно без него обойтись каким-то другим образом. Мне самому будет интересно узнать - каким. А лучше всего выложите скрин из console - возможно стили перекрываются.
@media screen and (max-width: 992px) {
.logo {
display: block !important;
margin: 0 auto !important;
}
}
-
06:53
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
-
20:42
-
09:21
Основные этапы разработки сайта для стоматологической клиники
-
12:26
-
10:30
-
18:43
Продвижение своими сайтами как стратегия роста и независимости
-
22:46
-
06:18
-
12:23
ТОП-10
- Почему SERVER_ADDR имеет не тот IP 50301 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 31941 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 26277 visits
- Как через css изменить цвет png изображения? 11765 visits
- Blob video url download 11310 visits
- Php curl запрос через прокси с авторизацией 10720 visits
- Работа с captcha vk api 9517 visits
© "hostciti.net" 18.3.2026 | 03:55