YUI Compressor媒体查询问题

I've been coding out the redesign for a responsive website and it's been a lot of fun...and a lot of media queries. A few of the media queries have multiple conditions so I have `and` sprinkled into them quite a bit. Everything was going swimmingly until I found out that beta testers weren't able to see the layout move while resizing their browser, which was a totally confusing to me.

我一直在为响应式网站进行重新设计，这很有趣……还有很多媒体查询。 一些媒体查询具有多种条件，因此我已经对它们进行了很多研究。 一切都进行得很顺利，直到我发现Beta测试人员在调整浏览器大小时无法看到布局变化，这对我来说完全是个困惑。

It turns out that my CSS was being incorrectly squashed by our older version of YUI Compressor. Basically a spacing issue was being created:

事实证明，我们的旧版本的YUI Compressor不正确地压缩了我CSS。 基本上是在创建间距问题：

only screen and (min-width: 760px) and (max-width: 1000px)

/* ... becomes ... */

only screen and (min-width: 760px) and(max-width: 1000px) /* boo, doesn't work! */

Not cool, YUI -- not cool. Of course we should update our YUI compressor but sometimes you can't easily do that, especially if it's in a third party library you don't want to modify. Here's how I fixed the issue:

YUI，不酷，不酷。 当然，我们应该更新我们的YUI压缩器，但是有时您不容易做到这一点，尤其是如果它在您不想修改的第三方库中时。 这是我解决问题的方法：

only screen and (min-width: 760px) and/* Screw YUI! */(max-width: 1000px)

Adding those comments to my CSS source code somehow prevented the space from being squelched and thus my responsive design was once again responsive. You do have to admit that sometimes you appreciate a hack more than your standard code, right?

将这些注释添加到我CSS源代码中以某种方式阻止了空间的压缩，因此我的响应式设计再次响应了。 您确实必须承认，有时候您对黑客的理解远胜于标准代码，对吗？

翻译自: https://davidwalsh.name/yui-compressor-media-query-error