Позиционирование элемента из: before /: after вне его границ в IE

Question

Позиционирование элемента из: before /: after вне его границ в IE

0

Я пытаюсь создать элемент с :before или :after и поместить его в нижней части своего родителя, наполовину из этого элемента, чтобы скрыть тень окна. Кажется, это работает, за исключением IE.

Демонстрация: http://jsfiddle.net/XV6pT/

Белая граница от :before должна огибать нижнюю границу и ее тень. Однако в Internet Explorer части элемента ниже нижней границы кнопки не отображаются.

Нет фильтра или подобного, что бы скрыть что-то скрытое (в соответствии с тем, как отключить фильтр градиента интернет-браузера Internet Explorer от отсечения контента, который должен переполняться?). CSS скопирован как есть.

Общая цель (может быть, у кого-то есть лучшая идея) заключается в том, что под кнопкой есть выпадающая навигация, которая должна выглядеть как раскрывающийся список, а кнопка - "одна часть", поэтому не должно быть никаких границ или тени окна между кнопку и выпадающий список.

Похоже, что проблема возникает в IE9 и IE10. Переключение с абсолютного на относительное позиционирование также не помогло.

Любые намеки?

pduersteler 03 окт. 2013, в 11:25

Источник

Теги:

html

css

css3

internet-explorer

pseudo-element

1 ответ

Ещё вопросы

MrMerrick · Accepted Answer · 2013-10-03T08-14-00.000Z

Взгляните на это: создание тени с CSS3 со всех сторон, но одно

Он включает в себя немного больше html, но IE и псевдоэлементы могут свести вас с ума. Этот ответ также включает в себя тень для меню "базовый уровень", но без глубокого изучения, я думаю, что его можно безопасно удалить.

Удачи!