0

我刚刚浪费了一天的时间试图自己找到答案。

我应该有这个（适用于 FF），但是使用 IE7/8（我必须符合 IE7/8）我有这个。

这是代码：

<DIV style="HEIGHT: 10px" class="timeline">
    <DIV style="WIDTH: 24px; LEFT: 0px" class=separator title=W1>
        <DIV class=left></DIV>
        <DIV style="WIDTH: 24px" class=bar></DIV>
        <DIV class=right></DIV>
    </DIV>
    <DIV style="WIDTH: 156px; LEFT: 24px" class=separator title=W2>
        <DIV class=left></DIV>
        <DIV style="WIDTH: 156px" class=bar></DIV>
        <DIV class=right></DIV>
    </DIV>
</DIV>

和 CSS ：

body{
    margin:0;
    padding:0;
}
.timeline{
    position:absolute;
    height:10px;
    margin-top:15px;
    margin-left:20px;
}
.timeline .separator{
    position: absolute;
    height:20px;
}
.timeline .separator .left{
    position: absolute;
    background-color: #000;
    left: 0;
    width: 1px;
    height: 10px;
}
.timeline .separator .bar{
    position: absolute;
    margin-top:4px;
    background-color: red;
    height:2px;
}
.timeline .separator .right{
    position: absolute;
    background-color: #000;
    right: 0;
    width: 1px;
    height: 10px;
}

谢谢你的帮助 ！

4

2 回答 2

1

即使您的 .bar div 没有文本内容，IE7 也会始终将其设置为包含当前字体大小的文本时的高度。修复很简单，只需添加一个字体大小和行高：

.timeline .separator .bar{
    position: absolute;
    margin-top:4px;
    background-color: red;
    height:2px;
    font-size: 0px;
    line-height: 0px;
}
于 2012-06-28T09:02:17.790 回答
0

你的问题是line-height. 将其设置为 0px，它将起作用:)

于 2012-06-28T07:17:31.433 回答