submit: stesso css, diversa visualizzazione in FF e IE

[stefanoi]

Ciao bellissimi!

Ho un piccolo problema. Questo input viene visualizzato correttamente (in modo ordinato e della lunghezza giusta) su FireFox, ma non su Internet Explorer. So di questa problematica, che non è da poco. Nel mio caso non è grave la differenza, ma se qualcuno sa darmi qualche dritta per migliorare la compatibilità con i due browser... Il print screen è in allegato !

Grazie a tutti...

<input name="submit" type="submit" class="inputImg_recupera" onClick="window.document.form1.azioneDaFare.value='recupera'" onFocus="this.blur();" value="recupera dal cestino"> 

input.inputImg_recupera{
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
text-transform:uppercase;
background-image:url(<? echo $dirImg;?>cestinoPieno2_sub.gif);
background-position:top left;
background-repeat:no-repeat;
padding-left:30px;
height:26px;
background-color:#f6f6f6;
cursor:pointer;
}

[Mich_]

Praticamente mentre FF usa il padding-left per spostare la scritta dal margine e lasciare il posto all'immagine, IE sommail padding allo spazio dell'immagine.

Magari esiste qualche hack che gia` risolve il problema (lo puoi trovare nei siti di layout tra i "link utili"); in alternativa io vedo due possibili soluzioni:
- passare a XHTML Strict (in cui IE6 dovrebbe comportarsi come FF)
- usare un commento condizionale per eliminare il padding in IE (da inserire dopo il CSS standard):
<!--[if IE]><style type="text/css">
input.inputImg_recupera {padding:0;}
</style><![endif]-->

[stefanoi]

Originariamente inviato da Mich_
Praticamente mentre FF usa il padding-left per spostare la scritta dal margine e lasciare il posto all'immagine, IE sommail padding allo spazio dell'immagine.

Magari esiste qualche hack che gia` risolve il problema (lo puoi trovare nei siti di layout tra i "link utili"); in alternativa io vedo due possibili soluzioni:
- passare a XHTML Strict (in cui IE6 dovrebbe comportarsi come FF)
- usare un commento condizionale per eliminare il padding in IE (da inserire dopo il CSS standard):
<!--[if IE]><style type="text/css">
input.inputImg_recupera {padding:0;}
</style><![endif]-->

Bhè grazie.. per il momento ho risolto impostando nel css width e margin-right... per il discorso della compatibilità credo che dovrò prenderlo in considerazione e dedicarci un po di tempo apposta....