Мне нужна помощь по очень специфической проблеме, касающейся некоторых моих «медиа-запросов».Чтобы сделать текст читаемым на мобильных устройствах, я написал следующее:
html{font-size: 100%}
для обычных устройств и это:
@media screen and (max-aspect-ratio: 7/8) and (min-height: 1100px){html{font-size: 190%;}}
для мобильных пользователей, чтобы иметь возможность читать текст большего размера.
Я был действительно счастлив, потому что он работал отлично, и все элементы и тексты отображались отлично.(Точность: все мои размеры шрифта / и некоторые из моих отступов между элементами имеют размер в единицах "rem".)
У меня была другая ширина div некоторые свойства (но не font-size), на которых я использовал медиазапросы, подобные этому:
@media screen and (max-width: 700px){
.ftrsection{
float: none;
/* some other code */
}
Исходный код этого div:
.ftrsection{
float:left
}
, но я решил применить этот медиа-запросы в других условиях, которые аналогичны для html{font-size: 190%}:
@media screen and (max-aspect-ratio: 7/8) and (min-height: 1100px){
.ftrsection{
float: none;
/* some other code */
}
}
И я на самом деле не могу понять, почему, но когда я применяю этот предыдущий код, некоторые из моих текстов становятся как бы вдвое больше ... Может кто-нибудь помочь мне, пожалуйста?Это очень раздражает.
Спасибо.