Pongo el código corregido. Lo único que no consigo es separar los enlaces de el menú vertical entre ellos( separación de link) y alinear el menú vertical a la izquierda que empiece un poco mas abajo que el menú horizontal.
Os dejo el codigo:
Código HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>prueba foro</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
{margin:0;padding:0; border:0; outline:none; position: relative;}
ul#navlist {
margin-left: 150px;
padding-left:100px ;
margin-top:130px;}
#navlist li {
display:table;
float:left;
height:4em;
list-style-type:none;
margin:15px;
width:4em;
}
#navlist a {
display:table-cell;
height:100%;
position:relative;
text-align:center;
vertical-align:middle;
text-decoration: none;
color: #444;
border: 1px inset #660;
}
#navlist a:link.item1 {background: #ff0000;}
#navlist a:link.item2 {background: #00ff00;}
#navlist a:link.item3 {background: #0000ff;}
#navlist a:link.item4 {background: #ffff00;}
#navlist a:link.item5 {background: #ff3300;}
#navlist a:hover {
color:#ff3300;
border: 1px outset #69f;
}
#navlist a:hover.item1 {background: #ff0033;}
#navlist a:hover.item2{background: #99ff00;}
#navlist a:hover.item3{background: #0033ff;}
#navlist a:hover.item4 {background: #ffff33;}
#navlist a:hover.item5 {background: #ff6600;}
#navlist a:visited.item1 {background: #ff0000;}
#navlist a:visited.item2{background: #00ff00;}
#navlist a:visited.item3 {background: #0000ff;}
#navlist a:visited.tem4 {background: #ffff00;}
#navlist a:visited.item5{background: #ff3300;}
#cabezeras { margin: 50;50;50;}
.contenedor {
padding-top: 220px;
margin-left: 280px ;
margin-right: 210px;
clear:both; }
#cabezeras { margin: 50;50;50;}
.menuvertical{
list-style: none;
margin:40px ;
padding:0,46p;
}
.menuvertical li a { text-decoration: none; }
.menuvertical a:link.item6 {color: #ff0000; font-family:fantasy; font-style:oblique; font-size:20px; font-weight:200;}
.menuvertical a:link.item7 {color:#9966CC;font-family:fantasy; font-style:oblique; font-size:20px; font-weight:200;}
.menuvertical a:link.item8{color: #0000ff;font-family:fantasy; font-style:oblique; font-size:20px; font-weight:200;}
.menuvertical a:link.item9 {color: #ffff00;font-family:fantasy; font-style:oblique; font-size:20px; font-weight:200;}
.menuvertical a:link.item10 {color: #ff3300;font-family:fantasy; font-style:oblique; font-size:20px; font-weight:200;}
.menuvertical a:hover {
color:#ff3300;
border: 1px outset #69f;
}
#navlist a:hover.item6 {background:ff0033;}
#navlist a:hover.item7 {background: #99ff00;}
#navlist a:hover.item8 {background: #0033ff;}
#navlist a:hover.item9 {background: #ffff33;}
#navlist a:hover.10 {background: #ff6600;}
#navlist a:visited.item6{background: #ff0000;}
#navlist a:visited.item7 {background: #00ff00;}
#navlist a:visited.item8 {background: #0000ff;}
#navlist a:visited.item9 {background: #ffff00;}
#navlist a:visited.item10 {background: #ff3300;}
#cabezeras { margin: 50;50;50;}
</style>
</head>
<div id="navcontainer">
<ul id="navlist">
<li><a class="item1" href="#"> 1</a></li>
<li><a class="item2" href="#" >2</a></li>
<li><a class="item3" href="#">Item three</a></li>
<li><a class="item4" href="#">Item four</a></li>
<li><a class="item5" href="#">Item five</a></li>
</ul>
</div>
<div class="contenedor">
<h1> el texto Empieza aquí</h1>
<div class="menuvertical">
<ul class="menuvertical">
<li ><a class="item6" href="#" >iten 1 </a></li>
<li><a class="item7" href="#">iten 2</a></li>
<li><a class="item8" href="#">iten 3</a></li>
<li><a class="item9" href="#">iten 4</a></li>
<li><a class="item10" href="#">iten 5</a></li>
</ul>
</div>
<body>
</body>
</html>