problema css solo su chrome

davidelc

Nuovo Utente
13 Mar 2010
16
0
0
firefox tt ok,

ie tt ok,

chrome no...

mi spiego,

sono dei semplici pulsanti in css che quando ci passa il mouse cambiano sfondo sembrando che vengano schiacciati :)

struttura del tipo:


Codice:
.pulsante{
	background-image:url(url);
	background-repeat:no-repeat;
	}
	
.pulsante :hover{
	background-image:url(url);
	background-repeat:no-repeat;
	}


poi nella pagina li richiamo con una tabella:


Codice:
<a href="#" target="_blank">
    <table class="pulsante" width="242" height="62" border="0" cellpadding="0" cellspacing="0" bgcolor="#333333" bordercolor="#FFFFFF">
      <tr>
        <td></td>
      </tr>
    </table>
    </a>


solo su chrome sembra che non vadano, non ho provato opera safari ecc
 
Ultima modifica:

davidelc

Nuovo Utente
13 Mar 2010
16
0
0
eh scusa hai ragione :)

in realtà è tutto giusto, ma ho sbagliat a riportarvi il codice,

ho riportato il modello del css, in realtà avendo + pulsanti, nel css non ho la classe .pulsante, ma varie classi tipo:

.pulsantemyspace
.pulsantefacebook
.pulsanteyoutube
.pulsanteforum

ecc
ecc

e ho messo .pulsante per generalizzare ;)

ora correggo e generalizzo anche nel html ;)


cmq qualche idea su cosa può essere? penso sia capitato a molti... no?
 

davidelc

Nuovo Utente
13 Mar 2010
16
0
0
dopo ore e ore di prove e scleri vari...

HO RISOLTO !


ecco come ho lavorato:


- prima ho pensato che l'errore potesse essere dato dalle tabelle, avendo richiamato la classe nelle tabelle, magari chrome non lo supportava... allora ho eliminato il "class="nomepulsante"" dalle tabelle, e ho invece aperto dei tag "div" che contenessero le tabelle stesse.

in pratica il codice che prima era:

Codice:
<a href="#" target="_blank">
    <table [B]class="pulsante"[/B] width="242" height="62" border="0" cellpadding="0" cellspacing="0" bgcolor="#333333" bordercolor="#FFFFFF">
      <tr>
        <td></td>
      </tr>
    </table>
    </a>


l'avevo trasformato in:

Codice:
[B]<div class="pulsante" align="center">[/B]
<a href="#" target="_blank">
    <table width="242" height="62" border="0" cellpadding="0" cellspacing="0" bgcolor="#333333" bordercolor="#FFFFFF">
      <tr>
        <td></td>
      </tr>
    </table>
    </a>
    [B]<div>[/B]


in questo modo funzionava (anche se ho dovuto riadattare gli spazi fra i pulsanti che altrimenti essendo contenuti nel div e non + solo nella table mi venivano quasi sovrapposti).


solo che succedeva che la prima immagine rimaneva leggermente + a sx della seconda, per cui al passaggio del mouse si vedeva l'effetto ma risultava spostato anche di 2-4px a dx, creando un pessimo effetto dei due pulsanti sovrapposti...

quindi ho dovuto lavorare ancora nel css cercando di pensare a un modo per vincolare allo stesso modo le due immagini...

ho provato il position ma non ha funzionato, solo con l'absolute si vedeva l'effetto, il margin non mi dava risultati, allora mi è finalmente venuto in mente che si parlava di background, quindi backgruond-position mi è sembrata una buona idea...

infatti ho modificato il css da così (è sempre un esempio, non riporto il css originale ma lo schema):

Codice:
.pulsante{
	background-image:url(url);
	background-repeat:no-repeat;
	}
	
.pulsante :hover{
	background-image:url(url);
	background-repeat:no-repeat;
	}


a così:


Codice:
.pulsante{
	background-image:url(url);
	background-repeat:no-repeat;
        background-position:bottom;
	}
	
.pulsante :hover{
	background-image:url(url);
	background-repeat:no-repeat;
        background-position:bottom;
	}


e magicamente va tutto.... :)
 
Discussioni simili
Autore Titolo Forum Risposte Data
S problema con css bootstrap3 HTML e CSS 4
Emix Problema con creazione form css/mobile HTML e CSS 3
F [Javascript] Problema funzione jquery con elementi css esterni Javascript 1
A [WordPress] Problema CSS con diversi browser WordPress 4
S Problema con Form CSS HTML e CSS 1
berry94mf Problema con include e css PHP 1
V Problema Rollover con css HTML e CSS 1
M problema con media query CSS HTML e CSS 1
D Problema collegamento file css con html HTML e CSS 4
S Problema con il css di un font HTML e CSS 2
S Problema tabella datatables a causa dei css HTML e CSS 3
P Problema sovrapposizione di css HTML e CSS 1
A Problema gestione layout con css HTML e CSS 11
Andre7890 Problema CSS in Form Contatti HTML e CSS 7
F problema con sfondo CSS HTML e CSS 2
C Problema con il CSS per il comando text-align HTML e CSS 10
M css html problema con explorer help HTML e CSS 0
G problema con css PHP 9
novello88 Problema stampa CSS [Era: CSS print] HTML e CSS 1
B problema css HTML e CSS 3
B Problema di inserimento "menu con css" in pagina web "con tabelle" HTML e CSS 5
M Problema con css HTML e CSS 3
M problema css con ie8! help HTML e CSS 0
K problema con current css HTML e CSS 0
M Problema CSS e IE HTML e CSS 0
L problema con menù css HTML e CSS 1
T problema con i css ... explorer visualizza male... HTML e CSS 2
I Problema con i CSS su diversi browser HTML e CSS 3
I Problema compatibilità CSS HTML e CSS 1
I Problema CSS! HTML e CSS 3
M [Firefox/CSS] Problema immagine di sfondo centrata HTML e CSS 1
F CSS e IE problema HTML e CSS 0
S Problema con CSS IE 7 e XP HTML e CSS 2
O problema menu tendina css HTML e CSS 1
E [Problema] CSS su IE HTML e CSS 6
M Problema CSS nei widget con sfondo sfumato HTML e CSS 0
R Problema con i css in standard mode HTML e CSS 3
N [PHP+HTML+CSS] Problema con un div HTML e CSS 6
R problema con il css dei link HTML e CSS 2
S Piccolo problema con i CSS HTML e CSS 2
I Problema CSS con joomla e phpbb [Era: joomla e phpbb] Joomla 2
G Css, problema margine con explorer HTML e CSS 0
T problema Doctype css e anchor links(credo) HTML e CSS 0
T problema css e firefox HTML e CSS 0
F [CSS] Problema con IE e div fixed HTML e CSS 2
C problema strano css HTML e CSS 5
gladenko CSS e DIV problema di dimensionamento HTML e CSS 3
G Problema coi colori di un menu CSS HTML e CSS 3
R Problema con pop-pu in css HTML e CSS 4
E Problema con CSS con 3 colonne HTML e CSS 5

Discussioni simili