rtl.css и media queries
Есть элемент с классом .block.
Для него прописаны правила в трёх местах.
В style.css:
.block { float: left; }
В rtl.css:
.block { float: right; }
В media.css:
@media screen and (max-width: 800px) {
.block { float: none; }
}
Почему для rtl-версии сайта медиа-запрос не выполняется?
В исходном коде видно, что файл rtl.css подгружается последним. Но разве медиа-запросы не имеют приоритет? Помогите, пожалуйста, разобраться.
Медиа-запросы не имеют приоритета. Вот вам пример. Раскройте сниппет во весь экран и подвигайте окно браузера.
Нижний .block2 меняет цвет, а верхний .block - нет. Потому что медиа-запрос для верхнего блока перекрыт следующим правилом, которое гласит: фон всегда зеленый.
Так что если хотите, чтобы медиа-запросы работали, размещайте их ниже по тексту вашего файла css.
.block,
.block2 {
width: 100%;
height: 50px;
border: 1px solid white;
}
@media screen and (max-width: 650px) {
.block {
background: red;
}
}
.block {
background: green;
}
.block2 {
background: green;
}
@media screen and (max-width: 650px) {
.block2 {
background: red;
}
}<div class="block"></div>
<div class="block2"></div>
-
06:53
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
-
20:42
-
09:21
Основные этапы разработки сайта для стоматологической клиники
-
12:26
-
10:30
-
18:43
Продвижение своими сайтами как стратегия роста и независимости
-
22:46
-
06:18
-
12:23
- Почему SERVER_ADDR имеет не тот IP 50339 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 31950 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 26313 visits
- Как через css изменить цвет png изображения? 11770 visits
- Blob video url download 11316 visits
- Php curl запрос через прокси с авторизацией 10724 visits
- Работа с captcha vk api 9522 visits
© "hostciti.net" 27.3.2026 | 10:08