Html 已设置样式，边框半径在非FF浏览器上显示大于定义的高度

我在a中的a的样式方面遇到了x浏览器问题。在FF上，该行是预期的2px高，并在CSS中声明。然而，当我在Safari、Chrome或IE9上看到它时，线条看起来要粗得多。事实上，当使用Safari的Firebug等价物检查时，它会将其视为4px

这是Firefox上不明显的边界半径CSS属性的问题吗？我希望它看起来像我如何构建标记和CSS，以及它如何在Firefox中显示，但我不确定标记有什么问题

这是Firefox上的外观：

这是Safari和IE9/Chrome上的外观：

我的标记：

<span id="course_divider"><hr></span>

将高度从

您将获得您的解决方案：-

演示

从

您将获得您的解决方案：-

---

演示

这只是您的css与长方体模型的关系问题

高度为2px，边框宽度为1px

因此，长方体模型是在上/右/下/左各1px处创建的

因此，对于边框宽度=4px高度，您可以选择2px高度加上1px顶部+底部

去掉2倍的高度，一切都会好的

您的背景色也不是必需的

#course_divider hr {
 border: 1px solid black;
 border-radius: 7px 7px 7px 7px;
}

---

这只是一个与你的css有关的盒子模型的问题

高度为2px，边框宽度为1px

因此，长方体模型是在上/右/下/左各1px处创建的

因此，对于边框宽度=4px高度，您可以选择2px高度加上1px顶部+底部

去掉2倍的高度，一切都会好的

您的背景色也不是必需的

#course_divider hr {
 border: 1px solid black;
 border-radius: 7px 7px 7px 7px;
}

---

hr{border:0；border top:1px solid 555；边距：0；高度：1px；}hr{border:0；border top:1px solid 555；边距：0；高度：1px；}

#course_divider hr {
 border: 1px solid black;
 border-radius: 7px 7px 7px 7px;
}