Почему content у псевдоэлемента в IE не там стоит?

Question

[abusabir]

Здравствуйте! Суть такая: делаю псевдо-элемент before например.

.question::before {
    content: "?";
    display: block;
    width: 50px;
    height: 50px;
    position: absolute;
    left: 0px;
    top: 10px;
    font-size: 3rem;
    line-height: 5rem;
    font-style: italic;
    text-align: center;
    color: #FFF;
    background: #E04C43 none repeat scroll 0% 0%;
    border-radius: 100%;
}

Всё здорово, кроме IE, в нём блок-то на месте, а вот содержимое content (в моём случае знак вопроса) - на него словно position не подействовал и он висит чуть выше блока.

Answer 1

[Роман]

Я думаю проблема в ремах
IE 9 & IE 10 do not support rem units when used in the font shorthand property (the entire declaration is ignored) or when used on pseudo elements.

IE 9, 10 and 11 do not support rem units when used in the "line-height" property when used on :before and :after pseudo elements (https://connect.microsoft.com/IE/feedback/details/...).

Answer 2

[Вадим Белкин]

а у .question position задан?

Comments

[abusabir]

relative