抱歉时间..先不放 Demo.. 先描述一下我遇到的问题:
我有一段 CSS 代码, 是这样的:
.it-is-flex {
display: -webkit-flex;
-webkit-flex-direction: row;
display: -ms-flexbox;
-ms-flex-direction: row;
display: flex;
flex-direction: row;
}
这个在 OS X 的 Safari, Firefox, Chrome 都能正常跑的.
但是我跟其他的代码放在一起 cssmin 以后, 发现不生效了.
三个浏览器都能识别到属性, 显示在 Devtools, 但是就是不生效.
我回去看没有 cssmin 的版本, 依然很正常,,,
搞了好久好久, 按网上 Opera 文档某个例子改了一下顺序, 结果 cssmin 就正常了...
.it-is-flex {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
难以理解... 有同学遇到过或者知道原因的么?
添加一个测试:
两个 CSS 文件内容一样, 顺序不一样, 都通过 cleancss by-p.css 命令压缩:
首先,肯定是不需要连在一起写才能正常的。
所以最值得怀疑的就是楼主用的CSS压缩工具。
我帮你看了下,失败的那个文件,#box的display属性被你用的压缩工具删掉了两个,只剩下了display:-ms-flexbox。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。