Problema con css, perché non mi visualizza i colori di sfondo?

[netghost]

Ho questo codice

<div id="MenuTable_01">
        <div id="MenuPrincipale_01">
          [img]Img/sfBottone.gif[/img]

          

          &tilde;ACQUAFITNESS

          

          &tilde;NUOTO

          

          &tilde;PALLANUOTO

          

          &tilde;SINCRO

          

          &tilde;TUFFI

          

          &tilde;TRIATHLON

          

          &tilde;SALVAMENTO

          

          &tilde;MASTER

          

          &tilde;DISABILI

          

        </div>
      [img]Img/Corsie150.gif[/img]

      </div>

e questo è il css relativo

html,body{
margin: 0;padding:0
}

div#MenuTable {
 font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size: 11px;
 background-color: #CCE2F8;
 border-color: #00267F;
 border: 1px;
 border-style: solid;
 width: 150px;
}

div#MenuPrincipale_01 {
 float: left;
 width: 150px;
 font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
 font-size: 11px;
 margin : 0px 0px 0px 0px;
 padding: 1em 0 0 10px;
 text-Align : left;
 border: 1px;
 border-style: solid;
}

Come mai non mi fa vedere il colore di sfondo? In cosa ho sbagliato?

[carloast82]

può essere che nell'id del div chiami MenuTable_01 mentre nel css chiami #MenuTable?

[netghost]

Sì, me ne sono accorto alla fine pure io, mentre invece, come posso dare spazio tra una riga e l'altra senza usare il
e come posso cambiare il colore del testo quando ci passo sopra?
Prima usavo la classe "Menu", ma ora non funziona più.

.TxtBlue {
	FONT-SIZE: 11px; 
        COLOR: #00267f; 
        FONT-FAMILY: Verdana
}

A.Mnu {
	FONT-SIZE: 11px; COLOR: #00267f;
        FONT-FAMILY: Verdana;
        TEXT-DECORATION: none
}

A.Mnu:hover {
	COLOR: #7f0000
}

[carloast82]

prova con line-height:--px; (per quanto riguarda l'altezza della riga)

purtroppo ora son di corsa... spero ti possa dare una mano qualcun'altro per i link.... al massimo ci sentiamo più tardi.

mi dispiace.

[netghost]

 <div id="MenuTable">
        <div id="MenuPrincipale_01">
          [img]Img/titSportAcquaticiMenu_02.png[/img]


          [img]Img/dot.gif[/img]&tilde;ACQUAFITNESS


          [img]Img/dot.gif[/img]&tilde;NUOTO


          [img]Img/dot.gif[/img]&tilde;PALLANUOTO


          [img]Img/dot.gif[/img]&tilde;SINCRO


          [img]Img/dot.gif[/img]&tilde;TUFFI


          [img]Img/dot.gif[/img]&tilde;TRIATHLON


          [img]Img/dot.gif[/img]&tilde;SALVAMENTO


          [img]Img/dot.gif[/img]&tilde;MASTER


          [img]Img/dot.gif[/img]&tilde;DISABILI

          

        </div>
      [img]Img/Corsie150.gif[/img]

      </div>

L'ho inserita, nel css, ma non sono sicuro che l'abbia inserito correttamente

html,body{
  margin: 0;
  padding: 0px 0px 0px 0px;
}

div#MenuTable {
  font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 11px;
  background-color: #CCE2F8;
  border-color: #00267F;
  border: 1px;
  border-style: solid;
  width: 150px;
}

div#MenuPrincipale_01 {
  float: left;
  width: 150px;
  font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
  font-size: 11px;
  margin : 0px 0px 0px 0px;
  padding: 0 0 0 0px;
  text-Align : left;
  line-height:15px;
}
.TxtBlue {
  padding: 0 0 0 5px;
  FONT-SIZE: 11px;
  COLOR: #00267f;
  font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
}

A {
  FONT-SIZE: 10px;
  COLOR: #00267f;
  font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
  TEXT-DECORATION: none;
}

A:hover {
  TEXT-DECORATION: none;
  COLOR: #ff0000;
  font-family: verdana, Geneva, Arial, Helvetica, sans-serif;
  TEXT-DECORATION: none;
}

[carloast82]

Ciao,
con firefox mi da il div MenuTable con il colore che hai scelto come sfondo ma non va a comprendere completamente il div MenuPrincipale_01... togliendo il float:left da quest'ultimo dovresti risolvere, anche se per un menu di questo tipo ti consiglierei l'utilizzo di una lista verticale.

del tipo (ho provato a rifare quello che hai postato)

codice html:

<div id="MenuTable">
    
[img]Img/titSportAcquaticiMenu_02.png[/img]
         
<ul id="menu">[*][img]Img/dot.gif[/img][url="aquafitness.htm"][b]˜ ACQUAFITNESS[/b][/url][*][img]Img/dot.gif[/img][url="nuoto.htm"][b]˜ NUOTO[/b][/url][*][img]Img/dot.gif[/img][url="pallanuoto.htm"][b]˜ PALLANUOTO[/b][/url][*][img]Img/dot.gif[/img][url="sincro.htm"][b]˜ SINCRO[/b][/url][*][img]Img/dot.gif[/img][url="tuffi.htm"][b]˜ TUFFI[/b][/url][*][img]Img/dot.gif[/img][url="triathlon.htm"][b]˜ TRIATHLON[/b][/url][*][img]Img/dot.gif[/img][url="salvamento.htm"][b]˜ SALVAMENTO[/b][/url][*] [img]Img/dot.gif[/img][url="master.htm"][b]˜ MASTER[/b][/url][*][img]Img/dot.gif[/img][url="disabili.htm"][b]˜ DISABILI[/b][/url][/list]
       
[img]Img/Corsie150.gif[/img]

      
</div> 

codice css

html,body{
margin: 0;
padding: 0px 0px 0px 0px;
}

div#MenuTable {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
background:#CCE2F8;
border-color: #00267F;
border: 1px;
border-style: solid;
width: 150px;
margin:0;
padding:0;
text-align:left;
}

ul#menu{
width:150px;
list-style:none;
text-align:left;
margin:0;
padding:0;
}

ul#menu li{
text-align:left;
padding:0; 
margin:0;
}

ul#menu li a:link{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:10px;
color:#00267f;
display: block;
width:150px;
height:15px;
line-height:15px;
text-decoration:none;
font-weight: bold;
}

ul#menu li a:hover{
color:#f00;
text-decoration:none;
} 

[netghost]

Originariamente inviato da carloast82
Ciao,
con firefox mi da il div MenuTable con il colore che hai scelto come sfondo ma non va a comprendere completamente il div MenuPrincipale_01... togliendo il float:left da quest'ultimo dovresti risolvere, anche se per un menu di questo tipo ti consiglierei l'utilizzo di una lista verticale.

del tipo (ho provato a rifare quello che hai postato)

[...]

Grazie, ecco il risultato, ma non capisco come mai siano così distanziati in verticale i vari titoli.

[carloast82]

hai provato a diminuire
height:
e
line-height:
?

[netghost]

sì, si schiacciano le lettere

[carloast82]

Originariamente inviato da netghost
sì, si schiacciano le lettere

strano.... che valori hai messo in height e line-height?
:master: