Build a House Painting - Build a House Painting

HTML-CSS
1

Tell us what’s happening:

Failed:40. Your #chimney should have a top value that puts it at the top of your #house.

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html>
<head>
    <link href="styles.css" rel="stylesheet">
</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 */
  #house {
            position: relative;
            width: 500px;
            height: 400px;
            background-color: #f5e7d5;
            border: 5px solid #333;
            margin: 120px;
        }
        
        #house > div {
            position: absolute;
        }
        
        #roof {
            top: -100;
            width: 100%;
            height: 150px;
            background-color: #8b4513;
            border: 3px solid #5d2d0c;
            clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
        }
        
        #chimney {
            width: 60px;
            height: 120px;
            background-color: #a0522d;
            border: 3px solid #5d2d0c;
            left: 80px;
            top: -50px; 
            z-index: -1;
        }
        
        #door {
            width: 100px;
            height: 180px;
            background-color: #5d2d0c;
            border: 3px solid #333;
            bottom: 0;
            left: 200px;
        }
        
        #window-1 {
            width: 80px;
            height: 80px;
            background-color: #add8e6;
            border: 3px solid #333;
            left: 100px;
            top: 200px;
        }
        
        #window-2 {
            width: 80px;
            height: 80px;
            background-color: #add8e6;
            border: 3px solid #333;
            right: 100px;
            top: 200px;
        }

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Challenge Information:

Build a House Painting - Build a House Painting

2

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

3

Hi @fish_99

Your chimney does not appear to be a part of the roof, also the roof is an unusual design. Perhaps change it to a rectangle.

For next time, describe the issue in your own words. Learning to communicate problems is a part of becoming a web developer.

Happy coding