Perchè questa grossa differenza...

[luxflash]

Salve a tutti,
sto realizzando un menù con css ma il risultato tra firefox e Ie è molto differente.
Ovviamente, quanto pare, firefox rispetta le classi mentre Ie no.
A me andrebbe bene la visualizzazione ottenuta con firefox, anche se non riesco a mostrare l'immagine del mondo in basso al menù.

Come fare?

Vi posto l'immagine dei due risultati ed il codice del css.

Che ne dite?


Con la speranza che qualcuno abbia già riscontrato un problema simile ...

attendo suggerimenti!

Grazie

:::::CSS::::::

.menu {
background-image: url(world.jpg);
background-position: left;
background-position: bottom;
float: left;
width: 186px;
height: 476px;
padding: 0px 0px 0px 0px;
vertical-align: bottom;
background-color: #F0F0F0;
background-repeat: no-repeat;
background-attachment: fixed;
}


.menu ul, .menu li {
margin: 2px;
padding: 0px;
list-style-type: none;
}

.menu ul ul {
padding-left: 10px;
}



.menu a:link, .menu a:visited, .menu a:active {
padding: 3px 10px 3px 20px;
color: #FFFFFF;
display: block;
background-image: url(menublu.gif);
text-decoration: none;
}

.menu a:hover {
color: #FF9900;
text-decoration: none;
}

.main_menu {
border-left: 0;
}

.sub_menu {
border-left: 0;
}

.menu_current {
font-weight: bold;
}


:::: FINE CSS :::::

[luxflash]

a quanto pare il problema sta in questo stile:

.menu a:link, .menu a:visited, .menu a:active {
padding: 3px 10px 3px 20px;
color: #FFFFFF;
display: block;
background-image: url(menublu.gif);
background-repeat: no-repeat;
text-decoration: none;
}


chi sa il perchè?

[Mich_]

Non lo so esattamente, ma il padding e` interpretato diversamente nei due box-model.

Prova comunque a settare
line-height: 1.3em;
e/o a settare
height: 1.3em;

Nota: in alcuni casi occorre settare ambedue allo stesso valore.
Il valore 1.3em e` preso circa a caso, ma e` una buona base di partenza.

[luxflash]

il problema sta nel display: block; ma se non lo uso le il blu della barra menu si ferma alla lunghezza esatta della parola...
come fare?

[Mich_]

Ma come lo fai il menu? Ceh strumenti HTML stai usando?
Dovresti usare <ul> e[*], mentre ora mi par di capire che non li usi.

Prova a vedere come li fanno i "guru", citati nei "link utili" (sezione menu).