开发者

Centering an image between two lines in IE

I have this code to center an image between two horizontal lines.

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;
    margi开发者_高级运维n-right:auto;} 
}

The HTML code looks like this <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" />

Now I've looked at the page on multiple screens at various resolutions and it has come out fine on all of the desktops and laptops I've looked at aside from an issue with the lines running into each other when minimized.

It has worked fine in all browsers as well except for IE 8 and 9, the lines and the rest of the page looks fine except I can't get this image to center at all in IE and compatibility view does not help or change it one bit.

Can someone help a noob out and tell me how to get images to center in IE.


Wrap this in a containing div if you need to position it elsewhere.

.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;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜