Tell us what’s happening:
hello can you help me with this code plz.
here it ask me put the chimney on top of house which i did it by putting a z-index but it still say its not completed can you plz help me.
Preformatted text
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>House Painting</title>
<link rel="stylesheet"href="styles.css">
</head>
<body>
<div id="house">
<div id="chimney"></div>
<div id="roof"></div>
<div id="window-1"></div>
<div id="window-2"></div>
<div id="door"></div>
</div>
</body>
</html>
/* file: styles.css */
body{
background-color:skyblue;
}
#house{
position:relative;
border:3px solid black;
background-color:pink;
width:500px;
height:400px;
top:100px;
left:120px;
}
#chimney{
position: absolute;
top: -110px;
right:120px;
width: 40px;
height: 400px;
border: 3px solid black;
background-color: brown;
z-index:-1;
}
#roof{
position:absolute;
width:500px;
height:100px;
border:3px solid black;
background-color:grey;
}
#window-1{
position:absolute;
width:70px;
height:70px;
border:3px solid black;
background-color:white;
z-index:4;
top:200px;
left:40px;
}
#window-2{
position:absolute;
width:70px;
height:70px;
border:3px solid black;
background-color:white;
top:200px;
right:50px;
}
#door{
position:absolute;
width:150px;
height:250px;
border:3px solid black;
background-color:rgb(160, 94, 94);
bottom:0;
left:50%;
transform: translateX(-50%)
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36
Challenge Information:
Build a House Painting - Build a House Painting
https://www.freecodecamp.org/learn/full-stack-developer/lab-house-painting/build-a-house-painting`Preformatted text`