PayneLess Designs - Tables: Three in Line

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Tables: Three in Line</title>

<meta name="created" content="Sun, 24 Oct 2010 14:53:23 GMT">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="PayneLess Designs">
<meta name="copyright" content="Jan 2004 to present.">
<meta name="robots" content="all">
<meta name="revisit-after" content="60 days">

<link rel="copyright" href="copyright_pld.html">

<style type="text/css">
* { margin: 0; padding: 0; border: 0; }

h1 {
margin-top: 6%;
color: #0f0;
}

h2 {
margin-top: 3%;
}

h1, h2 {
font-size: 2.5em;
font-family: verdana, arial, sans-serif;
text-align: center;
}

hr {
width: 100%;
margin-top: 5%;
border-bottom: 1em ridge #339966;
}

div#table_wrap {
width: 950px;
height: 713px;
margin: 0 auto;
background: url(http://img696.imageshack.us/img696/4695/leeironmonger.jpg) no-repeat center scroll;
border: 1px solid #f00;
overflow: auto;
}

div#left {
float: left;
width: 300px;
margin-top: 3.3%;
border: 1px solid #ff0;
}

div#center {
width: 300px;
margin: 0 auto;
margin-top: 3.3%;
border: 1px solid #0f0;
}

div#right {
float: right;
width: 300px;
margin-top: 3.3%;
border: 1px solid #00f;
}

table {
width: 100%;
border-collapse: collapse;
}

td {
width: 100%;
padding: 5px;
text-align: justify;
}

td img {
display: block;
width: 240px;
height: 240px;
margin: 0 auto;
}

caption {
font-size: 2em;
color: #700;
}
</style>

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="iestyle.css">
<![endif]-->
</head>
<body>
<div id="table_wrap">
<h1>WEBSITE</h1>

<hr>

<h2>HOME</h2>

<div id="left">
<table summary="">
<caption>What's New</caption>
<tbody>
<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>

<tr>
<td><img src="http://img225.imageshack.us/img225/4635/19blank.png" alt=""></td>
</tr>

<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>
</tbody>
</table>
</div>

<div id="right">
<table summary="">
<caption>What's Hot</caption>
<tbody>
<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>

<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>

<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>
</tbody>
</table>
</div>

<div id="center">
<table summary="">
<caption>&nbsp;</caption>
<tbody>
<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>

<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>

<tr>
<td>Suspendisse sed porttitor sem. In hac habitasse platea dictumst. Proin nec lorem mi. Cras dolor nisl, lacinia quis vestibulum accumsan, feugiat in tortor. Sed non ultricies nisi. Cras imperdiet bibendum odio, vitae viverra dolor tincidunt eget. Etiam scelerisque sodales felis, at sollicitudin lectus consectetur et. Duis adipiscing lorem sed dolor eleifend id lacinia mauris laoreet. Aliquam iaculis porta dolor, id scelerisque nibh cursus ac. Sed in nulla sed felis interdum vestibulum. </td>
</tr>
</tbody>
</table>
</div>

</div>
</body></html>