IE 11中的背景颜色和边框行为不端

Question

我正在努力让IE 11的行为像Chrome和FF一样，我不知道该怎么办......

这是代码：

#main {
    position: relative;
    top: 20px;
    height: 400px;
    -webkit-background-color: rgba(72, 72, 72, 0.2);
    background-color: rgba(72, 72, 72, 0.2);
    /*background-color: #484848;*/
    width: 460px;
    margin: 0 auto;
    -webkit-border-radius: 5px;
    -webkit-border: 1px solid #a1a1a1;
    border-radius: 5px;
    border: 1px solid #a1a1a1;
}

这是视觉效果......

半透明的背景颜色被忽略， border-radius 也被忽略。此外，Chrome的行为与FF相同......

任何提示都将不胜感激

丹尼斯

以下是该部分的HTML：

<main id="main">
  <div id="resultContainer">
    <section id="i0" class="wDay">
        <h2>
            <span class="day" ></span>
            <span class="temp" ></span>
        </h2>
        <img src="">
        <span class="wDescript" style="color:#2050ff;word-break:break-all;"></span> 
        <span class="wind" ></span><br/> 
        <span class="humid" ></span> 
        <span class="other1" ></span> 
        <span class="other2" ></span> 
    </section>
    <section id="i1" class="wDay">
        <h2>
            <span class="day" ></span>
            <span class="temp" </span>
        </h2>
        <img src="">
        <span class="wDescript" style="color:#2050ff;word-break:break-all;"></span> 
        <span class="wind" ></span><br/> 
        <span class="humid" ></span> 
        <span class="other1" ></span> 
        <span class="other2" ></span> 
    </section>
    <section id="i2" class="wDay">
        <h2>
            <span class="day" ></span>
            <span class="temp" </span>
        </h2>
        <img src="">
        <span class="wDescript" style="color:#2050ff;word-break:break-all;"></span> 
        <span class="wind" ></span><br/>  
        <span class="humid" ></span> 
        <span class="other1" ></span> 
        <span class="other2" ></span> 
    </section>
    <section id="i3" class="wDay">
        <h2>
            <span class="day" ></span>
            <span class="temp" </span>
        </h2>
        <img src="">
        <span class="wDescript" style="color:#2050ff;word-break:break-all;"></span> 
        <span class="wind" ></span><br/>  
        <span class="humid" ></span> 
        <span class="other1" ></span> 
        <span class="other2" ></span> 
    </section>
  </div>
</main>

Answer 1

启动开发人员工具并确保浏览器处于标准模式。如果您处于兼容模式，则不会在IE中看到这些样式。

尝试添加X-UA兼容元标记以强制执行标准模式。

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

Answer 2

今天是2014年8月8日，Microsoft不支持 <main> 标记。 div，section，article等工作得很好......

所以，谢谢大家的帮助。

此致

丹尼斯