28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai chargé les animations hover.css (http://ianlunn.github.io/Hover/) et ai copié la css Push pour mes boutons, sur la home de www.cedricgournay.com

J'ai un petit soucis avec IE11. Regardez mes boutons, le left position a sauté et mes boutons sont collés à gauche. Ils sont OK sur Safari PC, Firefox, Chrome.
Dans la css .push, j'ai essayé de mettre le display à inline au lieu de inline block. Ce qui résoud mon pb d'IE mais mes boutons n'ont plus d'animation sur Firefox et Safari.

Quelqu'un a t-il une idée ? (j'ai contacté les auteurs mais aucune réponse)
Merci de votre aide, ces différences de navigateurs me rendent un peu folle...
Bonne soirée !
Modérateur
Bonjour,

Comment calcules-tu le left ?
Par exemple pour el premier tu te retrouve avec un "15,6%".
En enlevant le ",6" ça se positionne bien. IE n'aime peut être pas les virgules...
Ah tu as raison ! Ces calculs sont basés sur la demande du client, qui est designer donc très précis.
Si je mets mes mesures en pixels plutôt qu'en %, est-ce que ça va perturber le côté responsive pour les tablettes / mobiles ?
Modérateur
Si tu tiens aux % laisses les mais vire les décimales Smiley cligne

[EDIT] 41.3% -> 41%
Si c'est en dur c'est bon (je comprends même pas comment on peut demander 41.3%... bref) et si c'est calculé à la volé faut juste prendre la partie entière.
Modifié par _laurent (04 Aug 2014 - 09:56)
OK ! mais est ce que tu sais pourquoi qd dans .push, je mets display:inline à la place de inline-block, les boutons prennent bien en compte mon left et tout fonctionne sur IE mais ça ne va pas sur Safari et FF.
Modérateur
[EDIT] Au temps pour moi j’étais parti sur la hauteur Smiley sweatdrop c'est sur la largeur que ca réagi pas pareil. Au passage, depuis le code de départ (sans virer les virgules quoi, si on vire "width:70px;" tout se cale bien... la je reste... pantois.

<fail>Je pencherais pour une différence de gestion de la hauteur en inline... Encore un mystère IE...
La réponse ne doit pas être loin... http://www.w3.org/TR/CSS2/visudet.html#inline-non-replaced </fail>

Modifié par _laurent (04 Aug 2014 - 10:19)
Trop fort, il suffit de virer la width sur 1 seul des boutons et tout revient ds l'ordre, trop bizarre.
Merci ! (j'ai posté un autre mini soucis sur ce forum, si ça te dit Smiley cligne )
Administrateur
_laurent a écrit :
Bonjour,

Comment calcules-tu le left ?
Par exemple pour el premier tu te retrouve avec un &quot;15,6%&quot;.
En enlevant le &quot;,6&quot; ça se positionne bien. IE n'aime peut être pas les virgules...

Il préfère les points non ? Mais je doute que les autres navigateurs apprécient plus donc je suppose que c'est une typo et que c'était écrit 15.6 ?
C'était bien des points.
IE, ma hantise. Mais mon autre pb sur ce forum est avec Safari Smiley decu un décalage de qq pixels en trop)