css不能在chrome(linux和windows)中工作

我有这个代码:

<style type="text/css"> div { margin: 100px auto; width: 0px; height: 0px; border-right: 30px solid transparent; border-top: 30px solid red; border-left: 30px solid red; border-bottom: 30px solid transparent; border-top-left-radius: 30px; border-top-right-radius: 30px; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; position: relative; } </style> <div></div> 

产生:

haflcircle

在Firefox中,

但在铬(Linux和Windows – 没有尝试在Mac)我看不出为什么?

实际上,我相信这是一种错误。 它适用于我,如果你改变高度和宽度为1px。 不幸的是,这留下了一个小白点,但可以通过将背景更改为红色并将背景剪辑更改为内容来修复。

JSFiddle示例。

因为您将0px宽度和0px高度分配给div,所以您什么都看不到。

 width: 0px; height: 0px; 

改变这一点,希望它是可见的。