Originariamente inviata da
Prill
per il menu non hai bisogno di una tabella, puoi usare un elenco, e non è necessario tutto quel codice. Riparti da questo:
codice HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento senza titolo</title>
<style type="text/css">
<!--
* {margin:0; padding:0;}
#menu {width:auto;list-style:none; height:100px; line-height:100px; border:double 4px #6d5e48; border-radius: 10px; background:#473219; opacity:0.7; overflow:hidden}
#menu li{width:20%; display:block; float:left; text-align:center}
#menu a { color:#fff;text-decoration:none;font-size:48px; font-family:vivaldi;}
#menu a:hover { color:#000;}
-->
</style>
</head>
<body>
<ul id="menu">
<li><a href="./index.html" title="">Home</a></li>
<li><a href="#" title="">Introduzione</a></li>
<li><a href="#" title="">Capitoli</a></li>
<li><a href="#" title="">Gallery</a></li>
<li><a href="#" title="">Contenuti</a></li>
</ul>
</body>
</html>
nota che margini e padding sono stati azzerati su tutti gli elementi e che le impostazioni dei link vanno direttamente sui link (avrei potuto creare anche una classe con la formattazione e poi applicarla a ciascun singolo link - non al div o alla cella che lo contenevano - invece per far prima e avere codice più snello ho definito un id menu, dato all'elenco, e i link contenuti al suo interno).
Ora ricrea la tua struttura, ma considera che se il tuo div contenitore generale deve avere una altezza del 100%, la stessa altezza dovrai impostare su body e html (html, body {height:100})
ointer; } e al primo di essi "home" ho dato l'ancoraggio, e me lo da di un colore violaceo, che io non vorrei perchè farei un rollover
Rispondi quotando
perchè non sono il massimo nelle spiegazioni
