Я решил половину проблемы, но не полностью понял проблему, которая меня беспокоит. Интересно, может ли кто-нибудь помочь мне понять, что играет?медиа-запрос max-width 767px - стили отображаются только с разрешением 766 пикселей или ниже (только с включенным firefox)
У меня есть iframe, установленный на 100% ширину через CSS. Контейнер div равен 767px. И поэтому так и есть iframe.
У меня есть следующий медиа-запрос в таблицу стилей в IFrame в:
@media (max-width: 767px) {
body {
background: red;
}
}
Во всех популярных браузерах протестированы кроме Firefox, запрос СМИ вступает в силу и устанавливает фон тела на красный. В Firefox медиа-запрос вступает в силу только тогда, когда iframe установлен на 766px - на 1px меньше, хотя максимальная ширина должна быть «до и в том числе». Это похоже на ошибку. Моим обходным решением пока является установка ширины iframe до 766.7px (вычесть .3 пикселя). Кажется, это работает в Firefox (вычитание 0.2 не работает).
Мой вопрос - что здесь происходит? Может ли это быть ошибкой в Firefox? Я знаю, что моя реализация iframe немного нерегулярна, но я думаю, что основная причина может быть связана с этим вопросом, который вдохновил мое решение: Media query lost in Firefox when window resized to max-width minus scrollbar width
hmm интересно! вы пытались найти, если такая ошибка уже существует в bugzilla? –
Я не знал о bugzilla, но я отправил отчет об ошибке. Я напишу здесь дополнительную информацию, которую я получу/узнаю. Большое спасибо за ответ! –
Теперь для FF и Chrome есть такие же ошибки. Я исправил его на данный момент с помощью 'max-width: 767.8px', и стили для' 767px' применяются к этой ширине. – gdfgdfg