IE8 CSS更高的特异性选择器被忽略

Question

我有一个IE8特殊问题让我疯狂：http://proffetdemo.themesforge.com/shop/

以下选择器在Chrome / Firefox等中正确应用。人

.tfshop-3 ul.products li.product {
    width: 30.5% !important;
}

但在IE8中它完全被忽略了。上面的选择器是另一个选择器的覆盖：

ul.products li.product {
    float: left;
    margin: 0 0 20px;
    position: relative;
    width: 48%;
}

任何人都知道为什么IE8会忽略更具体的选择器？

更新1：15/02/13 我现在认为这可能与在IE8中没有正确加载的respond.js有关 - 看起来其他媒体查询在IE8中没有开始 - 嗯......

Answer 1

尝试在课堂前添加标签。比如div.tfshop ul.products li.product

Answer 2

@media only screen and (min-width: 768px) {
  ...
  div.tfshop-3 ul.products li.product {
    width: 30.5% !important;
}
  ...
}

您将这些样式定义到@media条件查询中，IE8和http://caniuse.com/css-mediaqueries

不支持

这http://wicky.nillia.ms/enquire.js/可能有助于以更简单的方式处理它。