媒体查询：检查最小高度和最小宽度？ [英] Media Queries: check min-height and min-width?

问题描述

我试图根据浏览器的最小高度和最小宽度来改变我的页面上的CSS，所以我使用这个：

 （
 / * CSS stuff * / 
）
  

但由于某种原因，这不起作用。我可以同时检查最小高度和最大宽度（反之亦然）或最大高度和最大宽度，但检查两个最小值似乎不起作用。

我应该详细说明这一点：我希望浏览器在最小高度或最小宽度变为true时动作。

我做错了什么？

解决方案

使用和代替逗号，如下所示：

  @media（min-height：500px）and（min-width：580px）{
 / * CSS stuff * / 
} 
  

I am trying to change CSS on my page based on the min-height and min-width of the browser, so I am using this:

@media (min-height: 500px), (min-width: 580px) {
    /* CSS stuff */
}

But for some reason, this doesn't work. I can check for min-height and max-width (or vice versa) or for max-height and max-width at the same time, but checking for both min values doesn't seem to work.

I should specify this more: I want the browser to act if a min-height or a min-width becomes true. Using the and-operator will only work if both criteria are true.

Am I doing something wrong?

解决方案

Use and instead of a comma, like this:

@media (min-height: 500px) and (min-width: 580px) {
    /* CSS stuff */
}

这篇关于媒体查询：检查最小高度和最小宽度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！