Почему hr ведет себя не правильно в opera ?

Question

[nepster-web]

Наткнулся на интересную ситуацию:

Есть вот такой код:

.parent {
            border: solid 1px red;
            width: 200px;
            height: 200px;
            text-align: center;
        }

        .parent .child {
            border: solid 1px blue;
            width: 50px;
            height: 1x;
            display: block;
        }

<div class="parent">
        <hr class="child" />
    </div>

Теперь в чем проблема, hr это блочный элемент (даже вот так display: block) и по какой-то причине именно в опере ( версии 12.16) этот элемент становится по центру из-за родительского свойства ( text-align: center;).

Такой момент происходит только в опере, почему ?

Comments

[YemSalat]

Ничего что у вас див два раза закрыт?

[nepster-web]

@YemSalat: извиняюсь, это я тестировал и скопировал по ошибке

Answer 1

[Денис Заикин]

text-align: left ; добавленный в описание класса .child не работает?

Comments

[nepster-web]

интересно именно почему так происходит в опере ? Фикс не важен =)

[Денис Заикин]

возможно из-за уникальности браузерного движка.

Answer 2

[zenwarr]

codepen.io/anon/pen/kfbrx

Comments

[nepster-web]

а все-же почему так происходит в опере ? Тоесть интересно именно почему так ?

[zenwarr]

Не понимаю вас, у меня ваш код и в новой/старой опере, и в хроме, и в лисе выводит hr по центру за счет того, что в дефолтных стилях у браузера для hr задается margin-left: auto и margin-right: auto (если hr имеет display: block) или родительского text-align: center (если нет).