Paste_Image.png
<body>
<div id="header">
<div class="layout">
header
</div>
</div>
<div id="main" class="layout">
main
</div>
<div id="footer">
<div class="layout">
footer
</div>
</div>
</body>
.layout{
text-align: center;
width: 600px;
margin: 0 auto;
border: 5px solid;
}
#header{
width: 100%;
background: blue;
}
#main{
height: 400px;
background: yellow;
}
#footer{
width: 100%;
background: red;
}
Paste_Image.png
<body>
<div class="layout">
<div id="header">
header
</div>
<div id="main">
main
</div>
<div id="footer">
footer
</div>
</div>
</body>
.layout{
width: 600px;
margin: 0 auto;
text-align: center;
border: 5px solid;
}
#header{
background: blue;
}
#main{
background: yellow;
height: 400px;
}
#footer{
background: red;
}
