Ok, but how about WITHOUT a table. I was stumped. Tables are not liked nowadays everyone wants to do div tags and stylesheets. I am no style designer.
I didn't get the job, but I wish I can tell the guy: hey I can probably find something on the web and able to use it, and I did.
Masthead and Titles
Left
Middle
Right
Bottom
<html>
<head>
<title>
Multicolumn pages without tables or frames
</title>
<style type="text/css" media="all">
body {
font-family: arial, sans-serif;
background: #fff;s
}
#head {
margin: 10px 10px 0px 10px;
padding: 5px 10px;
border: 1px solid #000;
background: #cfc;
}
#masthead {
font-weight: bold;
font-size: 36pt;
color: #fff;
background: #9f9;
}
#left {
float: left;
width: 25%;
margin 0px;
}
.leftcontent {
margin: 10px;
padding: 5px 10px;
border: 1px dotted #000;
background: #eef;
}
#middle {
float: left;
width: 50%;
margin 0px;
}
.middlecontent {
margin: 10px 0px;
padding: 5px 10px;
border: 1px dotted #000;
background: #eff;
}
#right {
float: left;
width: 25%;
margin 0px;
}
.rightcontent {
margin: 10px;
padding: 5px 10px;
border: 1px dotted #000;
background: #ffe;
}
#foot {
margin: 0px 10px 0px 10px;
padding: 5px 10px;
border: 1px solid #000;
background: #cfc;
}
</style>
</head>
<body>
<div id="head">
Masthead and Titles
</div>
<div id="left">
<div class="leftcontent">
<p>Left</p>
</div>
</div>
<div id="middle">
<div class="middlecontent">
<p>Middle</p>
</div>
</div>
<div id="right">
<div class="rightcontent">
<p>Right</p>
</div>
</div>
<br clear="all" />
<div id="foot">
<p>Bottom</p>
</div>
</body>
</html>
No comments:
Post a Comment