Question

我想在html中代表一行。为此，我使用此代码：

<div class="blue_bar" style="margin-top: 10px;"></div>

在CSS中我定义了这个：

.blue_bar
{
    height: 5px;
    BACKGROUND-COLOR: rgb(0,0,136);
    margin-top: 10px
}

现在，这在谷歌浏览器上运行良好，但在IE上，它显示的是不同的行。我附上了两张照片，结果如下：

铬：
enter image description here

IE：
enter image description here

我有没有办法在IE上修改该行看起来像Chrome上的那一行？

编辑：使用IE9时会出现此问题，它适用于IE10。

Answer 1

添加 font-size：0; 属性。它是一个IE9（和更低版本）的bug，它不会让你的DIV元素小于字体大小。

<html>
<head>
<style>
.blue_bar
{
    height: 5px;
    background-color: rgb(0,0,136);
    margin-top: 10px;
    font-size: 0;
}
</style>
</head>
<body>
<div class="blue_bar" style="margin-top: 10px;"></div>

</body>
</html>

更新：修改此答案以便在IE9中使用

Height fix

Div标记在Internet Explorer上的行为有所不同

1 个答案: