Il "problema" vero è che con i CSS non devi più "ragionare" come se si trattasse di tabelle. I box possono essere considerati come delle "celle", ma non sono vincolati dalla struttura tipica delle tabelle. Premesso questo, mi sono "divertito" a convertire la tua pagina in XHTML...ti riporto qui il codice del file con tanto di CSS incorportato.
L'unica cosa è che ho usato sempre il Verdana come carattere, quindi sta a te modificarlo, se serve, nelle regole di stile. Inoltre ho usato i pixel come unità di misura dei caratteri...non è il massimo, visto che con IE non puoi modificarne le dimensioni (puoi provare tu a usare altre unità, come i pt).
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Documento senza titolo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
font-size: px;
font-family: Verdana,Helvetica,Arial,Sans-serif;
color: #000000;
background-color: #999999;
padding: 9px;
margin: 0;
}
hr,.nascosto {
display: none;
}
.clear {
clear: left;
}
#testata {
width: 100%;
min-height: 114px;
height: auto !important;
height: 114px;
background-color: #000000;
background-image: url(logo_girls.gif);
background-repeat: no-repeat;
background-position: center right;
position: relative;
}
h1 {
font-size: 23px;
font-family: Arial,Sans-serif,Verdana,Helvetica;
color: #ffffff;
padding: 0;
margin: 0 0 0 22px;
}
#testata em {
font-size: 15px;
font-weight: bold;
font-style: normal;
color: #999999;
}
#menutestata {
padding: 0;
margin: 0;
position: absolute;
top: 2px;
right: 25%;
}
#menutestata li {
list-style: none;
padding: 0;
margin: 0;
float: left;
}
#menutestata li a {
font-size: 10px;
color: #ffffff;
text-decoration: none;
text-transform: lowercase;
padding: 0 5px;
border-left: 1px solid #ffffff;
margin: 0;
float: left;
}
#menutestata li a#primolink {
border-left: none;
}
#navigation {
padding: 0;
margin: 0;
position: absolute;
bottom: 5px;
left: 22px;
}
#navigation li {
list-style: none;
padding: 0;
margin: 0 4px 0 0;
float: left;
}
#navigation li a {
font-size: 12px;
font-weight: bold;
color: #ffffff;
text-transform: lowercase;
text-decoration: none;
float: left;
}
#menulinks {
width: 100%;
min-height: 16px;
height: auto !important;
height: 16px;
background-color: #cccccc;
margin-top: 16px;
}
#links {
padding: 0;
margin: 0 0 0 22px;
}
#links li {
list-style: none;
padding: 0;
margin: 0 4px 0 0;
float: left;
}
#links li a {
font-size: 10px;
font-weight: bold;
color: #333333;
text-decoration: none;
line-height: 16px;
float: left;
}
-->
</style>
</head>
<body>
<div id="testata">
<h1>BladeXPerience.com</h1>
Underground Engine
<p class="nascosto">Inizio</p>
<hr />
<h2 class="nascosto">Menu testata</h2>
<ul id="menutestata">[*]Forum[*]Guestbook[*]Cards[*]Meeting[*]Directory[/list]
<p class="nascosto">Inizio</p>
<hr />
<h2 class="nascosto">Menu navigazione</h2>
<ul id="navigation">[*]Home[*]Humors[*]Curiosità[*]Hack[*]Linux[*]Guide[*]IRC[*]Programmi[*]Webmaster[*]Girls[/list]
<p class="nascosto">Inizio</p>
<hr />
</div>
<div id="menulinks">
<h2 class="nascosto">Menu links</h2>
<ul id="links">[*]Celebrità[*]Eden[*]Calendari[*]Giochi[*]Media[/list]
<br class="clear" />
<p class="nascosto">Inizio</p>
<hr />
</div>
...CONTENUTI DELLA PAGINA...
</body>
</html>
Questo codice permette anche di far "degradare" bene la pagina quando aumenti le dimensioni del carattere entro un certo limite ed è strutturato in modo che possa essere accessibile anche senza i CSS attivi (noterai che ci sono dei link che riportano all'inizio della pagina e delle linee di separazione delle varie sezioni, oltre ai titoli di queste ultime). Volendo, queste linee, i titoli e i link per tornare all'inizio possono essere impostati diversamente in modo da essere sempre interpretabili (ho usato display: none per comodità, per nasconderli, anche se non è la soluzione migliore).
Solo un consiglio...prova a visualizzare la pagina disabilitando i CSS (con un browser che lo permette come Firefox) e a "studiare" il mio CSS...imparerai molte cose utili. E se hai dei dubbi...c'è sempre il forum!