2013-09-13 2 views
2

Я пытаюсь иметь два stacked элементов с сноскойцвета фона получать наследуются от элемента тела

.background 
.container-fluid 
.footer 

Пожалуйста, смотрите мою скрипку:

http://jsfiddle.net/z9Unk/309/

я ожидаю, зеленый будет показан в фоновом режиме с нижним колонтитулом внизу.

Но он показывает черный (цвет фона тела). Почему это?

Если я удаляю фоновый цвет от body, тогда он показывает зеленый фон.

Как показать зеленый фон без удаления background-color из кузова?

ответ

4

У вас есть z-index:-1; на .my-world-background. body имеет z-index:0; по умолчанию, поэтому он отображается спереди.

+0

Я думал, что хорошо. Каково решение ... мне нужно установить z-index на тело? это может сломать мой отдых на сайте, которого я боюсь. Любое другое решение? –

+0

Вы можете добавить 'z-index: -2; position: relative; 'to' body', если это не испортит ничего другого. –

+2

В чем смысл установки z-индекса на этом div в любом случае ... просто удалите его. – Steve

2

Используйте цвет фона вместо цвета

.footer-content { 
    text-align:center; 
    font-size:22px; 
    background-color: green; 
} 
+0

Он _ис_ использует 'background-color'. –

+1

Нет, он использует цвет ... Линия 34 скрипки ... – Weinz

+0

«Я ожидаю, что зеленый будет показан в фоновом режиме», поэтому он не говорит о нижнем колонтитуле. –

0

.my-world-background DIV находится позади тела DIV так цвет фона для body берет верх. Вот почему вы видите зеленый цвет, когда вы удаляете свойство background-color с тела. Между тем нижний колонтитул не имеет набора свойств background-color, только свойство цвета, которое относится к цвету текста. Возможно, это то, что вы хотите:

http://jsfiddle.net/WSwjy/

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