Css3 webkit的宽度属性值无效

Question

我希望div在IE中具有特定宽度，并且在Chrome中应用不同的宽度。

#welcome {
  width: 200px; //1. style for IE
  width: -webkit-300px; //2. style for chrome
}​

关键点＆＃39; 2＆＃39;显示＆＃34;无效的属性值＆＃34;当我检查铬。 webkit不支持该属性＆＃39; width＆＃39;？这样做的正确方法是什么？

Answer 1

解决问题的另一种方法是使用'calc'函数并提供默认值

#welcome {
  width: 200px; //1. style for IE
  width: -webkit-calc(300px); //2. style for chrome - WORKS
}​

有趣的外卖是要了解'calc' method也可以使用单个参数。

Answer 2

没有安全的方法可以检测到这一点。当然，-webkit-calc（）现在可以正常工作，但下一版本的Chrome可能会停止收听它而转而使用calc（）。

最好的方法仍然是1.在两个浏览器中使用相同的值。 2.使用HTML if语句包含不同的IE CSS文件。像这样：

<!--[if IE ]>
  <link href="iecss.css" rel="stylesheet" type="text/css">
<![endif]-->