在IE中定位hr

时间:2012-12-18 10:22:02

标签: html css internet-explorer

我的<hr>需要80%的父级宽度和“左对齐”,而不是默认居中。

<div>
    <p>Some stupid text</p>
    <hr>
    <p>Ask a stupid text, what?</p>
</div>

我在现代浏览器中使用以下方法解决了这个问题:

hr
{
    width: 80%;
    color: #90b124;
    background: #90b124;
    height: 4px;
    border: 0;
    margin: 20px 0;
    position: relative;
    left: 0;
}

但是在IE(所有版本)中,它仍然处于中心位置。设计要求这个左定位hr。当然我可以使用<span>并将其称为一天,但语义较少。

有没有办法将其定位为IE中的deisred?

http://jsfiddle.net/jWcEp/

2 个答案:

答案 0 :(得分:3)

我知道@Nicsoft的答案对你有用,但还有另一种方式。

<hr>过去有align属性,HTML5不支持该属性。这已经被IE和Opera的CSS属性text-align和Firefox和WebKit的margin-left/right所取代。所以左对齐你可以这样做:

hr {
    margin-left:0
    text-align:left;
    width:80%;
}

here所示,并描述了here

答案 1 :(得分:1)

将float:left添加到hr {}

hr
{
    float:left; //Makes the element float to he left
    width: 80%;
    color: #90b124;
    background: #90b124;
    height: 4px;
    border: 0;
    margin: 20px 0;
    position: relative;
    left: 0;
}

也不要忘记清楚。