Css IE左上角边框差异

IE边框画和chrome边框画是不同的。这是我的问题css和屏幕截图（带缩放）

铬：

IE:

Chrome和其他浏览器左上角为绿色，但IE为红色。这在我的设计中造成了问题，我怎样才能解决这个问题

jsFiddle：

编辑：这是我真正的问题截图；

---

有点恼人的1像素。

我认为在这种情况下，两种浏览器都没有错；他们只是实现了相同的标准，但略有不同。在这种情况下，边框的角指定为分隔两种颜色的对角线。当然，当它只有一个像素宽时，对角线是相当没有意义的；规范并没有说更喜欢垂直线或水平线，所以这里有一些不同的解释

---

如果您真的需要保证这种情况下的颜色，我建议使用

：before

和

：after

在与主框分开的侧边上创建边框。

如果您告诉您想要实现什么样的效果，那么将有一个解决方案。e、 g.您可以使用两个嵌套div，一个带

左

和

右

边框，另一个带

上

和

下

这可能是我见过的最小问题，只有一个像素；）。是的，只有一个像素，但很烦人：）我添加了新的屏幕截图，看^

.test {
    width: 10px;
    height: 10px;
    margin: 10px;
    padding: 10px;
    border-left: 1px solid green;
    border-top: 1px solid red;
    border-bottom: 1px solid black;
    border-right: 1px solid blue;
}