28173 sujets

CSS et mise en forme, CSS3

[EDIT] : le problème venait d'ie7 et pas de firefox, voir mon dernier post. [/EDIT]

Pour verifier la compatibilité de mon site ie7 je l'ai testé sous firefox et opera.

Tout est d'équerre sous opéra et ie7 mais il y a un pixel fantome en trop en hauteur sous firefox. Il ne décale pas les blocs qui se suivent mais décale les background-image et les liens sont cliquables un pixel en dessous des blocks. Sous ie et et opera le lien n'est plus cliquable dès que l'on passe d'un bloc à l'autre.

D'où est ce que cela peut venir ?
Modifié par Black_Jack (14 Aug 2007 - 22:40)
Black_Jack a écrit :
D'où est ce que cela peut venir ?

Heu... de plein de trucs possibles et imaginables.

Pourrait-on voir une page en ligne?
Non je peux rien montrer en ligne, mais je vais faire un exemple :

Soit un bloc de 30px de haut, avec une background-image de 30px de haut :

sous ie7 et opera pas de pb, sous firefox j'ai une ligne épaisse d'un pixel en dessous du bloc, en fait la première ligne de pixels de la répétition de ma background-image. J'enlève le visuel parasite avec un no-repeat, mais la ligne virtuelle d'1px reste toujours (et c'est une bidouille donc j'aime pas).

Cette ligne ne décale pas la position des blocs en dessous, mais si le bloc est cliquable le lien fonctionnera aussi sur cette ligne d'1 pixel fantôme.
Modifié par Black_Jack (13 Aug 2007 - 12:59)
Là je crois que ça va être dur pour quiconque de trouver l'origine du problème. Faire un diagnostic sans jamais avoir croisé le patient, c'est pas évident.

Bon courage tout de même. Smiley smile
Après quelques bidouilles j'ai un résultat satisfaisant dans firefox et opera. Par contre le problème semble venir d'ie7 : il crée un genre de padding-top invisible, donc si mon code est propre maintenant, cela explique pourquoi j'avais une ligne fantôme d'1px sous mes blocs dans firefox.

Le problème maintenant c'est de savoir pourqoui j'ai du padding, surtout que j'utilise un css resetter!
Résolu : j'ai utilisé un line-height 1px plus petit que mon bloc et ie7 ma fait un beau centrage sans que firefos ou opera ne change. Pour la balise input qui avait aussi du padding fantôme je l'ai tout simplement sortie du flux avec un floating-left et le padding s'est envolé (un position : absolute ou relative fonctionne mais attention, il se positionnera par rapport au dernier parent sortit du flux).