2009-01-09 5 views
2

Je rencontre des problèmes avec des éléments centrés dans Firefox 3. (j'ai cherché et n'a pas pu trouver une réponse à - je l'espère pas re-post)Firefox 3 Bug (? Centrage des hacks CSS ou bugs)

J'ai réduit le code à seulement deux éléments pour le démontrer - vous pouvez le voir ici: http://prwmusic.com/misc/csstest/home-sample-fix.html

Maintenant lentement rendre la fenêtre du navigateur plus large et plus étroite. En supposant que vous utilisez Firefox 3, voyez-vous comment l'arrière-plan blanc apparaît et se trouve sur le côté gauche de la DIV bleue avec tous les autres pixels que vous faites glisser plus ou moins large? Pourtant IE6, IE7, Safari, et même FF2 sont bien. Ce que j'ai fait est créé un DIV et ajouté un "white page with shadow background" à ce DIV afin que les visiteurs puissent rendre le navigateur aussi étroit que possible avant que les barres de défilement horizontales n'apparaissent. Ensuite, il y a une DIV imbriquée qui a un fond bleu. La zone blanche à l'arrière-plan et la div de couleur bleue ont toutes deux une largeur de 970 pixels. Elles doivent donc toujours correspondre, car elles sont toutes les deux centrées. Ce qui semble se produire est que lorsque la taille de la fenêtre est un nombre impair, Firefox ajoute 1 au côté droit de l'image d'arrière-plan, mais il ajoute 1 au côté gauche du premier plan qui rejette tout.

La première idée pourrait être "inclure le bleu dans l'image de fond". Mais la conception même du projet sur lequel je travaille est assez complexe et cette bizarrerie se produit dans tout le site, tout le long et en bas des pages - ce n'est pas une option pour moi de faire en sorte que le bleu fasse partie du contexte. Je n'utilise que cet exemple simple pour démontrer.

Y a-t-il un moyen de garder les éléments toujours alignés dans Firefox 3 pour s'assurer que si le navigateur de quelqu'un est à une largeur impaire il n'y a pas d'étrangeté d'affichage? (évidemment, sans le casser dans tous les autres navigateurs)

Répondre

0

Vous avez votre élément de largeur fixe à l'intérieur de l'autre élément.

Essayez d'utiliser l'élément fixe comme conteneur et définissez la largeur de l'élément interne sur 100%.

+0

Mais si je donne une largeur fixe à la DIV la plus à l'extérieur (avec le fond d'ombre) alors la page sera essentiellement de 1006 pixels de large au lieu de 970 pixels, non? Comme c'est le cas maintenant, le défilement horizontal n'apparaîtra que lorsque la zone bleue commence à être coupée (l'ombre est ignorée). – user53561