Я новичок в гибком дизайне с использованием медиа-запросов CSS3. Я четко понимаю, как мы настраиваем таргетинг на разные устройства, используя эти медиа-запросы, но место, где я запутался, - BROWSER ZOOMING!!.
Для eg: Это мое нормальное правило css для тела
#body {
margin: 0 auto;
width: 70%;
clear: both;
}
и когда я хочу изменить это правило css для таргетинга устройств, ширина которых падает в диапазоне 150px и 600px, я добавляю этот конкретный мультимедийный запрос.
@media only screen and (min-width:150px) and (max-width:600px){
#body {
margin: 0 auto;
width: 90%;
clear: both;
}
}
Проблема. Я использую Google Chrome, и когда я увеличиваю примерно до 200%, этот конкретный мультимедийный запрос вступает в игру.
Как узнать, какие медиа-запросы писать для разных уровней масштабирования, иначе говоря, какова связь между уровнями масштабирования браузера и шириной пикселей.
