IE边框绘图和镀铬边框绘图不同。这是我的问题css和截图(带缩放)
.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;
}
铬:
IE:
Chrome和其他浏览器左上角是绿色,但在IE中是红色的。这在我的设计中出现问题,我该如何解决这个问题呢?
jsFiddle:http://jsfiddle.net/yLdF4/
编辑:这是我真正的问题截图;
有点恼人的1个像素。
答案 0 :(得分:1)
在这种情况下,我认为其中任何一个浏览器都不对;他们刚刚采用相同的标准略有不同。在这种情况下,边界的角被指定为分隔两种颜色的对角线。当然,当它只有一个像素宽时,对角线是没有意义的;规范并没有说更喜欢垂直或水平线,所以你可以在这里看到不同的解释空间。
如果您确实需要在这种情况下保证颜色,我建议您使用:before
和:after
在主框旁边创建边框。