Errore nel CSS impossibile

[RBNZ]

Mi sto scervellando da ore ma nulla!
Ho installato un plugin per l'utilizzo degli eventi nel calendario, funziona benissimo, se non per il fatto che in Safari il testo dell'evento compare più in basso di dove dovrebbe essere.

http://www.digitalmarketingmanagerau...it/calendario/

Su Chrome, Firefox ed Opera si vede bene.

Ho trovato questo:

.ajde_evcal_calendar.boxy .eventon_list_event .evcal_list_a {
text-align: left;
padding: 20px 0 15px;
border: none;
background: none;
position: static;
top: 50%;
transform: translateY(-50%);
z-index: 6;}

Ma se tolgo quel top:50% o lo imposto su auto su Safari lo vedo correttamente, mentre mi si sposta il blocco troppo in alto sul resto dei Browsers!!

1000 punti a chi riesce a trovare il maledettisimo errore nel CSS!!

 

[RBNZ]

Trovato!!

.ajde_evcal_calendar.boxy .eventon_list_event .evcal_list_a {
top: auto;
transform: none;
}

Era il transform a dare problemi, chissà perchè solo su Safari..
Il Plugin per Wordpress è EventOne comunque.

Ciao ragazzi!

 

[MarcoGrazia]

Purtroppo webkit e qualche altro browser ha qualche problema con la proprietà transform e i plugin non sempre sono molto precisi.
Un work around può essere quello di usare i vendor prefix:

-ms-transform: none; /* IE 9 */
-webkit-transform: none; /* Chrome, Safari, Opera */
transform: none;

Che forse è meglio che escludere del tutto la proprietà.

Vedi qui:
http://www.w3schools.com/cssref/css3_pr_transform.asp
http://www.w3schools.com/cssref/playit.asp?filename=playcss_transform_rotate&preval=none