IE игнорирует абсолютное позиционирование в :: перед

Использование IE11, но ищет решение IE9 +, я отлаживаю почему the labels at the bottom of this CSS bar chart are improperly positioned.IE игнорирует абсолютное позиционирование в :: перед

Из того, что я могу сказать с отладчиком IE - несмотря на сравнительную родительского контейнера, имеющего определенную ширину и высоту - position:absolute не применяется к ::before псевдо, в результате чего странно размещены этикетки:

.chart span::before { 
    position: absolute; 
    left: 0; 
    right: 0; 
    top: 100%;

В Chrome, FF и т. Д. Все хорошо: метки расположены ниже гистограммы, как ожидалось. Любое понимание того, почему это происходит, или любые советы по отладке :: before в IE (я не могу настроить таргетинг :: раньше, как я могу в Chrome и FF)?

источник

2014-10-20 bishop

Попробуйте заменить top:100% на bottom:-21px на ваш ::before псевдоэлемент. Это похоже на работу в FF, Chrome и IE9 +.

Demo

источник

2014-10-21 01:59:27 Talmid

С помощью jingo, это так! Вы (предположительно) предположили, что проблема «top» была проблемой, или вы отлаживали ее в IE? Если да, есть ли способ получить отладку IE ':: before', например Chrome и Firefox? (То есть ':: before' получает фактический элемент в DOM, который вы можете проверить, отдельно от применяемого селектора.) – bishop

@bishop Я задаю вопрос, соответствует ли 100% в других браузерах 21px, и это волшебство в создании он работает, но не является решением. – Rob

Я не знаю, как проверить и выделить фактический псевдоэлемент в IE, поэтому я только что просмотрел span, который позволяет вам видеть и возиться с стилями ':: before' в панели стилей« DOM » Explorer». – Talmid

IE игнорирует абсолютное позиционирование в :: перед

ответ

Смежные вопросы