Posts Details
Here is a detailed
explaination on this course
Html Tutorials
Html / Html Tutorials
The Html code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="container">
<div class="banner">
</div>
<div class="menu">
</div>
<div class="conten-area">
<div class="content-area-1">
</div>
</div>
<div class="footer">
</div>
</div>
</body>
</html>
The Css code
#container{
background: rgb(201, 201, 201);
width: 500px;
height: 700px;
}
.banner{
background: rgb(73, 155, 244);
width: 500px;
height: 200px;
}
.menu{
background: rgb(131, 179, 231);
width: 500px;
height: 100px;
}
.conten-area{
background: rgb(81, 154, 232);
width: 350px;
height: 300px;
display: flex;
}
.content-area-1{
position: relative;
background: rgb(18, 54, 92);
width: 150px;
height: 300px;
left: 100%;
float: right;
}
.footer{
background: rgb(122, 154, 177);
width: 500px;
height: 100px;
}
The Output
Leave a comment