Three Column Div based layout

Website is mostly designed in two column layout and three column layout.Three column layout is mostly used for website.First column is mostly used for navigation links ,Second column is used for content and third column is used for widgets or ads or banner.Following is Three Column layout.



<html>

    <head> 

        <title>Three Column Div wrap Layout </title>

</head>

<style type="text/css">

body{
margin:0px;
padding:0px;
border:solid 1px red;
}

#main{
margin-left:auto;
margin-right:auto;
height:100%;
width:945px;
border:solid 1px blue;
}
#left{
border:solid 1px yellow;
float:left;
width:250px;
height:auto;
}
#center{
border:solid 1px pink;
width:400;
float:left;
height:auto;
}
#right{
border:solid 1px purple;
width:280px;
height:auto;
float:left;
}
</style>
</head>
<body>
    <div id="main">
        <div id="left">
            <h1>Left</h1>

   
        </div>
        <div id="center">
            <h1>Center</h1>
           
        </div>
        <div id="right">
            <h1>Right</h1>
               
        </div>
    </div>
</body>
</html>

No comments:

Post a Comment