Ciao,
eccoti il codice completo in HTML con il suggerimento di togliere il div menu ul
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>La Maglia Rosanero - Alessandro Vitale Palermo Collection</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="La Collezione di maglie del Palermo di Alessandro Vitale dal 2000 ad oggi">
<meta name="Keyword" content="Alessandro Vitale,Palermo Calcio, #siamoaquile, Maglie da Calcio Palermo">
<meta name="author" content="Alessandro Vitale">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id= "container">
<header>
<div id="testata">
<div id="logo">
<img src= "logo ok@1x.jpg" alt="LOGO LA MAGLIA ROSANERO">
</div>
<div id="siamoaquile">
<img src= "siamoaquile.png" alt="HASHTAGSIAMOAQUILE">
</div>
<div id="social">
<img src="youtube.png" alt="Canale Youtube La Maglia Rosanero">
<img src="facebook.png" alt="Pagina Facebook La Maglia Rosanero">
<img src="instagram.png" alt="Pagina Instagram La Maglia Rosanero">
</div>
</div>
</header>
<nav id="menu">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">MAGLIE PALERMO</a>
<ul> <!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">2000 - 2001 Serie C</a></li>
<li><a href="#">2001 - 2002 Serie B</a></li>
</ul>
</li>
<li><a href="#">MEMORABILIA</a>
<ul> <!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">Submenu 1</a></li>
</ul>
</li>
<li><a href="#">FOTO STADIO</a>
<ul> <!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">Submenu 1</a></li>
</ul>
</li>
<li><a href="#">CORINI COLLECTION</a>
<ul> <!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">Submenu 1</a></li>
</ul>
</li>
<li><a href="#">CONTATTI</a>
<ul> <!-- Lista annidata: voci del sotto-menu -->
<li><a href="#">Submenu 1</a></li>
</ul>
</li>
</ul>
</nav>
<div id="presentazione">
<h2>..:: BENVENUTI IN LA MAGLIA ROSANERO.COM ::..</h2>
<p>Questo sito web nasce con il fine ultimo di accomunare tre tra le mie più grandi passioni della mia vita.<br>
Il Palermo Calcio, le maglie da collezione match worn indossate dai calciatori, le foto scattate allo stadio!<br>
La mia collezione è formata da maglie del Palermo dal 2000 ad oggi e da una sezione interamente dedicata al nostro capitano <i>"ad honorem"</i> EUGENIO CORINI.<br> Comprende anche una sezione di Memorabilia dove conservo dei gadgets sul Palermo, dai ritagli di giornale a videocassette, DVD, un polsino firmato da Corini e Toni e tante altre perle di storia Rosanero.<br>
Mi interesso alle foto sportive dal 2003 e le ho raggruppate nell'archivio fotografico consultabile in questo sito web. La sezione Foto Stadio comprende anche un' inedita sottosezione con tutte le emozioni vissute in quella magica giornata che è stata il 29/05/2004 con foto e video da me stesso prodotti. I soggetti delle mie foto sono per lo più le tifoserie organizzate come Warriors, Ultras, Brigate, BVS, UCN e anche momenti di puro calcio come le azioni svolte in campo e gli allenamenti pre-partita con le contestuali coreografie all'ingresso dei giocatori in campo.
Mi piace condividere la mia passione per il Palermo con chiunque per questo ho deciso di raccontare la storia del Palermo Calcio e di aprire un un BLOG dove pubblico i miei articoli e le notizie sul Palermo Calcio.<br> E' presente anche una pagina dove raccolgo tutte le testimonianze di giornali e TV che parlano di me, del mio sito e della mia collezione di maglie.</p>
</div>
</div>
</body>
</html>
mentre il codice css che al momento ho e non credo mi dia errori è questo:
*{
font-family:verdana, "sans serif";
padding: 0px;
margin: 0px;
}
body{
background-color:#f7e1e4;
margin:0;
padding:0;
}
/* contenitore generale */
#container{
width:1400px;
height:auto;
margin:5px auto;
display:block;
}
/* Header*/
#testata{
width:100%;
height:auto;
}
#logo{
width:auto;
height:auto;
margin-left:10px;
margin-top:30px;
float:left;
}
#logo img{
width:120%;
}
#social{
width:300px;
height:auto;
margin-top:40px;
margin-left: 600px;
float:right;
}
#social img{
width:20%;
float:right;
}
#menu{
width:100%;
height:60px;
background-color:#c5ad39;
clear:both;/* Impongo che non si affianchi al div superiore */
border: solid 1px;
}
#menu ul {
width:100%; /* Dimensioni della barra del menu */
padding:5px 10px;
display:inline-block;
font-weight: bold;
list-style-type:none; /* Stile della lista */
}
#menu li {
float:left;
position:relative;
text-align: center;
list-style: none;
}
#menu a {
color:#000; /* Colore del testo */
text-align:center; /*Testo allineato al centro */
text-decoration:none; /* Nessuna decorazione */
background:#c5ad39; /* Colore dello sfondo */
padding:15px 50px; /*Distanza tra le singole voci */
}
#menu li a {
background-color: #c5ad39;
color: #000;
padding: 15px 50px;
text-decoration: none;
display: block;
}
#menu a:hover {
background:#000; /* Colore dello sfondo */
color: #f7e1e4;
}
#menu ul ul {
position:absolute;
display:none;
}
#menu ul li:hover ul {
font-size: 14px;
display:block;
position:absolute;
margin:0px;
padding-left:0px;
}
#siamoaquile{
float:right;
padding-top: 80px;
}
#presentazione{
box-sizing: border-box;
border: solid #000000 1px;
text-align: center;
line-height: 35px;
padding: 5px 10px;
background-image: url(magliapalermoback.png);
background-repeat: no-repeat;
background-position: top;
}
Ora dovrei creare intanto un foglio di stile per le mediaquery...
e poi occuparmi di arricchire la home, creare la pagine interne del sito.