css - 在 IE 中使图像在两条线之间居中

Question

我有这段代码可以将图像居中放置在两条水平线之间。

CSS:

.line-scale-left {
    position: absolute;
    background-color: #000000;
    border: #000000;
    height: 4px;
    top:190px;
    width: 25%;
    left: 250px;
}

.line-scale-right {
    position: absolute;
    background-color: #000000;
    border: #000000;
    height: 4px;
    top:190px;
    width: 25%;
    right: 250px;
}

.center-img {
    display:block;
    margin-left:auto;
    margin-right:auto;} 
}

HTML 代码如下所示 <hr class="line-scale-left" /><img src="http://fleminglaw.biz/balance.gif" align="center" class="center-img" width="82px" height="61px" /><hr class="line-scale-right" />

现在，我在多个屏幕上以不同的分辨率查看了该页面，除了最小化时线条相互交叉的问题外，它在我查看过的所有台式机和笔记本电脑上都表现良好。

除 IE 8 和 9 外，它在所有浏览器中都运行良好，线条和页面的其余部分看起来很好，除了我无法在 IE 中将此图像居中并且兼容性 View 没有帮助或稍微改变一下。

谁能帮助菜鸟并告诉我如何让图像在 IE 中居中。

Answer 1

如果您需要将其放置在其他地方，请将其包裹在包含的 div 中。

.line-scale-left{
    float: left;
    width: 25%;
    margin-top: 30px;
}

.line-scale-right{
    width: 25%;
    float: left;
    margin-top: 30px;   
}

.center-img{    
    display:block;
    float: left;
}