Задать вопрос
@CurseOath
html

Код не работает, как так?

Есть код и он не работает.
Точнее, элементы с "z-index" равным минус один, не располагаются за элементами с "z-index" равным плюс один.
Вот текст кода:
<!DOCTYPE html>
<html>
<head>
<style>
#fon {
	background: url("fon.png") no-repeat top / 100% 100%;
	width: 100%; height: 100vh; position: relative; z-index: 0;
}
#main-img {
	background: url("mainimg.png") no-repeat top / 100% 100%;
	width: 100%; height: 100vh; position: absolute; z-index: 1;
}
#child-img-left {
	background: url("childimgleft.png") no-repeat top / 100% 100%;
	width: 100%; height: 100vh; position: absolute; z-index: -1;
}
#child-img-right {
	background: url("childimgright.png") no-repeat top / 100% 100%;
	width: 100%; height: 100vh; position: absolute; z-index: -1;
}
</style>
</head>
<body style="margin:0;">
	<div id="fon">
		<div id="main-img">
			<div id="child-img-left"></div>
			<div id="child-img-right"></div>
		</div>
	</div>
</body>
</html>

Так выглядит страница:
681ce1ad073f4733670519.png
  • Вопрос задан
  • 220 просмотров
2 комментария
Подписаться 2 Простой 2 комментария
Пригласить эксперта
Ответы на вопрос 1
Steel_Balls
@Steel_Balls 
<!DOCTYPE html>
<html>
<head>
<style>
#fon {
    background: url("fon.png") no-repeat top / 100% 100%;
    width: 100%;
    height: 100vh;
    position: relative;
    z-index: 0;
}
#main-img {
    background: url("mainimg.png") no-repeat top / 100% 100%;
    width: 100%;
    height: 100vh;
    position: absolute;
    z-index: 1;
}
#child-img-left {
    background: url("childimgleft.png") no-repeat top / 100% 100%;
    width: 100%;
    height: 100vh;
    position: absolute;
    z-index: -1;
}
#child-img-right {
    background: url("childimgright.png") no-repeat top / 100% 100%;
    width: 100%;
    height: 100vh;
    position: absolute;
    z-index: -1;
}
</style>
</head>
<body style="margin:0;">
    <div id="fon">
        <div id="child-img-left"></div>
        <div id="child-img-right"></div>
        <div id="main-img"></div>
    </div>
</body>
</html>
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
Senior Frontend (JavaScript) разработчик
Vital Partners
от 350 000 до 400 000 ₽
Frontend разработчик
AMarkets • Москва
от 2 000 $
Frontend разработчик на React
SkillsRock • Таганрог
от 60 000 до 90 000 ₽
Ещё вакансии