<html>
<head>
<title>tablelayout</title>
<style type="text/css">
<!--
table
{
background-color:teal;
width:70%;
height:100%;
border:1px solid #333;
margin-left:auto;
margin-right:auto;
}
td
{
border:1px solid black;
padding:5%;
text-align:left;
}
#header
{
width:100%;
height:25%;
background-color:#ddd;
background-image:url("sika.jpg");
}
#left
{
width:20%;
background-color:#eef;
height:65%;
}
#middle
{
width:80%;
height:65%;
}
#bottom
{
width:100%;
height:10%;
background-color:#6d9;
}
a.nav, a.nav:link, a.nav:visited
{
display:block;
font-family:arial, verdana;
font-size:14px;
width:80px;
text-decoration:none;
border:1px solid #663;
color:#eef;
background-color:66e;
font-weight:bold;
padding:2px 2px 2px 1px;
margin-bottom:3px;
margin-top:2px;
}
a.nav:hover
{
color:#66e;
background-color:#eef;
}
img
{
margin-left:30%;
boarder:2px solid #339;
}
-->
</style>
</head>
<body>
<table>
<tr>
<td colspan="2" id="header">
<hd1> Sikamaiset sivut </hd1>
</tr>
<tr>
</td>
<td id="left">
MENU
<a href="page2.html" class="nav">Page2</a>
<a href="page3.html" class="nav">Page3</a>
<a href="page4.html" class="nav">Page4</a>
<a href="page5.html" class="nav">Page5</a>
</td>
<td id="middle">
<img src="sika.jpg" alt="sika" />
</td>
</tr>
<tr>
<td colspan="2" id="bottom">
ALAOSA
</td>
</tr>
</table>
</body>