Problema Menu Css

**marcello90** · 18-12-2010, 18:05

Questo è il mio codice

codice:

<html>
<head>

<style type="text/css">
div
{  
background:url(pagina%20salvatore/Immagine.png);
height:60;
width:800;
    font-size: 11px;
    font-family: Verdana;
}
div#MENU
{
    text-align: Center;
    padding: 5px;
    background-color: #00C;
    border: Solid  1px  #F00; width:800; height:60;
}


a.MENU1
{ 
background: url(asd.gif);
width:200;
height:200;
 background:#06F;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px; 
	
	
}
a.MENU2
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}a.MENU3
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}a.MENU4
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}a.MENU5
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}a.MENU6
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}a.MENU7
{ 
    background-color: #0F0;
    color: #900;
    font-weight: Bold;
    text-decoration:none;
    width: 0;
    	 
    padding: 5px;
    border:  none 3px #000000;
	vertical-align:-23px;
	
}

a:hover.MENU1
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}
a:hover.MENU2
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}
a:hover.MENU3
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}
a:hover.MENU4
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}
 a:hover.MENU5
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}  
a:hover.MENU6
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}
a:hover.MENU7
{
    background-color: #778899;
    color: #EEEEEE;
    font-weight: Bold;
    text-decoration: None;
    width: 100px;
    padding: 5px;
    border: Solid 1px #000000;
}

</style>

</head>

<body>


<div id="MENU">
    home
    LINK # 2
    LINK # 3
    LINK # 4
    LINK # 5
    LINK # 6
    LINK # 7
</div>



</body>






</html>

Ho due problemi:
-Adattare i bottoni alla grandezza del contenitore del menu
-Mettere uno sfondo nei vari bottoni

Come posso fare???

**Prill** · 19-12-2010, 08:49

Guarda qui
attenzione a errori come height:60; width:800;, dopo il valore l'unità di misura (800px , 60px), da sempificare anche il css raggruppando le regole condivise. Per il resto trovi indicazioni al link indicato. Nello stesso sito moltissimi esempi con menu anche più complessi e creati con elenchi

Discussione: Problema Menu Css

Strumenti discussione

Ricerca discussione

Visualizza

Problema Menu Css

Permessi di invio