CSS3 成功和失败在同一个页面答案

【问题标题】：CSS3 succeed and fail in the same pageCSS3 成功和失败在同一个页面
【发布时间】：2012-02-23 06:03:53
【问题描述】：

我无法在单个页面中弄清楚为什么CSS3PIE 可以在外部页面阴影上工作，但不能在 IE8 中的照片阴影上工作。在其他浏览器中一切正常。

我将#page 用于外部页面 div 和 #facilities_maintable tr>td.column2 img为页面内容中的照片。

#page 
{
    position:relative; 
    width: 1024px;
    margin-left: auto;
    margin-right: auto;
    margin-top:0px;
    background-image: url('../../content/img/bg4.jpg');
    background-repeat: no-repeat;
    background-color: #efebe0;

    -webkit-box-shadow: #222 0px 0px 8px;
    -moz-box-shadow: #222 0px 0px 8px;
    box-shadow: #222 0px 0px 8px;

    behavior: url('../../Content/PIE.htc');
}

#facilities_maintable tr>td.column2 img
{
    margin:5px 15px 5px 15px; 
    border:1px solid #666;
    -webkit-box-shadow: #777 3px 3px 5px;
    -moz-box-shadow: #777 3px 3px 5px;
    box-shadow: #777 3px 3px 5px;
    behavior: url('../../Content/PIE.htc');
}

【问题讨论】：

尝试减少你的选择器。你需要这一切吗#facilities_maintable tr>td.column2 img --> .column2 img

标签： css css3pie

【解决方案1】：

只需设置td {border-collapse: separate;} 我知道，看起来很奇怪，但有效

【讨论】：

【解决方案2】：

Safari 到 5.1 版、Chrome 到 10.0 版和 iOS 支持 property-webkit-box-shadow。

Firefox 到 4.0 版支持 property-moz-box-shadow。

Internet Explorer 9.0 及以下版本不支持属性 box-shadow。但您可以使用过滤器的非标准属性：

filter: progid: DXImageTransform.Microsoft.dropshadow (offX = 5, offY = 5, color = # 000000);

【讨论】：