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).
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).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>
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!![]()



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).
Rispondi quotando