<!doctype html>
<html>
<head>
<title>
Example of DIV element - Part 2
</title>
<style>
.header {
padding:15px;
text-align:center;
background-color:#EEE;
font-size:24px;
}
.body {
overflow:auto;
height:300px;
}
.sidebar {
width:25%;
height:100%;
float:left;
background-color:lightblue;
}
.main-body {
width:75%;
height:100%;
margin-left:25%;
background-color:#ffffb1;
}
.footer {
padding:15px;
background-color:#EEE;
}
#title {
padding:10px;
text-align:center;
background-color:#6a67ce;
color:#FFFFFF;
font-family:arial;
}
#form-box {
padding:15px;
border: dotted 2px #6a67ce;
margin:10px;
}
#form-box div {
margin:10px;
}
</style>
</head>
<body>
<div class="header">This is header</div>
<div class="body">
<div class="sidebar">Sidebar</div>
<div class="main-body">
<div id="title">Feedback Form</div>
<div id="form-box">
<div><input type="text" placeholder="feedback..."/></div>
<div><input type="submit" /></div>
</div>
</div>
</div>
<div class="footer">This is footer</div>
</body>
</html>