Как сверстать такую шапку?

Question

[freeman0204]

Шапка Суть в том что идет шапка а снизу типа как тень. Но это не тень а просто плашка более темного цвета что бы создать объем. Я решил ее сделать через афтер. У шапки есть несколько фонов. Мне нужно сделать что бы средний он был сверху элемента сделаного через афтер (плашки снизу). Как это сделать. Как вообще управлять фонами, что бы поставить один выше другого? z-index не помогает мне.

Comments

[freeman0204]

Спасибо. Но это не помогло. Получается это фон шапки и этот фон не выходит за ее границы и поэтому его не видно на плашке. Как можно реализовать это так, что бы было видно?
А если применить фон к плашке то он вообще обрезается, так как плашка высотой в 100 пикселей. Как быть?

[freeman0204]

Может через img? Так делают фон?

Answer 1

[Юрий Олиярнык]

Вы можете добавить эту картинку через :before, дать абсолютное позиционирование, как и черной плажке, и для картинки поставить z-index больше чем в плажке.
Тогда картинка будет поверх черной плажки

Answer 2

[Ксения Михайлова]

Сделать выходящее за пределы блока изображение с помощью фона нельзя. Только располагать отдельным элементом, и позиционировать.