- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- problema pulsanti personalizzati
-
problema pulsanti personalizzati
Ho utilizzato iwebtoolsonline per generare le immagini di sfondo ed il css per personalizzare i pulsanti di submit. Il problema è che su internet explorer e firefox i pulsanti creati in questo modo si vedono bene, mentre su chrome e safari la parte destra del pulsante non è allineata con la parte sinistra, si trova più su di un pixel... sapete come potrei fixare questo problema?
Questi sono i pulsanti (visti con chrome e safari):
Mentre questo è il codice del css:
button { border: 0 none; cursor: pointer; font-weight: bold; padding: 0 15px 0 0; text-align: center; height: 20px; line-height: 20px; width: auto; } button.rounded { background: transparent url('images/btn_right.png') no-repeat scroll right top; clear: left; font-size: 1em; } button span { display: block; padding: 0 0 0 15px; position: relative; white-space: nowrap; height: 20px; line-height: 20px; } button.rounded span { background: transparent url('images/btn_left.png') no-repeat scroll left top; color: #FFFFFF; } button.rounded:hover { background-position: 100% -20px; } button.rounded:hover span { background-position: 0% -20px; } button::-moz-focus-inner { border: none; }
-
Se vuoi un consiglio, invece di animare i bottoni con i css utilizza javascripts, datti un occhiata a jQuery! con una semplicissima riga di codice riesci ad animare tutto quello che ti pare! Senza dover ricorrere ai miracoli per farlo andare su tutti i browser....
Se deciderai di usare jQuery guarda le funzioni mouseover e mouseout!Ciao
-
Se vuoi un consiglio, invece di animare i bottoni con i css utilizza javascripts, datti un occhiata a jQuery! con una semplicissima riga di codice riesci ad animare tutto quello che ti pare! Senza dover ricorrere ai miracoli per farlo andare su tutti i browser....
Se deciderai di usare jQuery guarda le funzioni mouseover e mouseout!Ciao