Нижний колонтитул за содержанием CSS

Question

Я искал в Интернете и не могу найти ничего, что работает здесь.

Мой нижний колонтитул скрывает мой основной контент, по-видимому, в каждом браузере, кроме Firefox.Я хочу, чтобы мой нижний колонтитул оставался позади моего основного контента.Сайт, который я создаю, является гибким и предназначен для размещения в окне браузера без прокрутки, поэтому я не уверен, что я ищу липкий нижний колонтитул.Вот почему у меня в нижнем колонтитуле установлено отрицательное поле.Я хочу сжать страницу нижним колонтитулом за черным ящиком.

Вот демоверсия jsFiddle и вот как я хочу, чтобы она выглядела так:

Answer 1

Попробуйте использовать свойство z-index.Смотрите это обновление jsFiddle

Answer 2

Вы можете использовать Z-Index для управления порядком элементов.Добавьте z-index: -1; Вот результат того, что вы ищете.http://jsfiddle.net/bd7Vy/3/

footer {
    clear: both;
    position: relative;
    margin: -5em;
    padding-top: 4em;
    color: black;
    width: inherit;
    height: 3.2em;
    background-color: #917266;
    background-repeat: repeat-x;*
    z-index:-1;
}