Web Programming Training By OM SIR Call for free Demo :9320957717/18

HTML LAYOUT GUIDANCE

write code for   index.html file:

<html>
<head>
<title> simple web page layout</title>
<link rel="stylesheet"  type="text/css" href="layout.css">
</head>
<body>
<div class=wrapper>

<div class=header>
 it is header
</div>

<div class=navigation>
it is navigation
</div>

<div  class=content>
it is content
</div>
<div class=sidebar>
it is side bar
</div>

<div class=footer>

it is footer
</div>
</div>
</body>

</html>

(2)write code  for   layout.css file:
.wrapper
{
width:600px;
background:#eee;
margin:0 auto 0 auto;

}
.header
{
height:100px;
background:red;
padding:20px;
text-align:center;
}
.navigation
{
height:50px;
background:lightgreen;
}
.content
{
min-height:400px;
background:#ddd;
width:400px;
float:left;
}
.sidebar
{
width:200px;
float:right;
background:orange;
min-height:400px;
}


output:


Previous
Next Post »