Alignement de l'image avec Galleria.js dans Opera Browser

Question

J'ai confiance que quelqu'un peut aider avec mon problème. J'ai un problème avec les utilisateurs qui visitent mon site (www.amigaos.net) en utilisant le populaire navigateur Opera; Si quelqu'un veut tester dans IE, ce serait génial, mais en tant qu'utilisateur Mac, j'évite les navigateurs inférieurs. J'utilise Galleria v 1.1.95 et Opera bêta 11 installé, mais je comprends le problème de mise en page (à partir des commentaires des utilisateurs) que cela se produit dans les versions précédentes. Donc, si vous visitez www.amigaos.net en utilisant Opera et cliquez sur Jeux dans le menu du haut, galleria.js charge la galerie et tout de suite vous devriez remarquer que l'image de la galerie principale est alignée à gauche dans la scène qui est un comportement incorrect . Safari et FireFox centrent l'image.

Je ne sais pas où je devrais regarder dans galleria.classic.css, le html ou le .js lui-même - comment puis-je obtenir Opera pour positionner correctement l'image au centre de la scène? Conseil s'il vous plaît.

Merci d'avance.

Answer 1

Le problème que je vois (image n'apparaissant pas du tout) est causé par Galleria.js en définissant une hauteur: 0. Il ne parvient pas à lire la hauteur de la scène (<div class="galleria-stage">) dans Opera - offsetHeight de cet élément renvoie 0 même après avoir donné au parent une hauteur explicite. (Cela s'avère être un bogue connu dans Opera où un enfant positionné avec les ensembles supérieur et inférieur signale toujours offsetHeight 0 si une hauteur explicite est attribuée à parent.)

Je suppose que le script pourrait détecter cela. Je ne suis pas tout à fait sûr pourquoi ils ont besoin de lire la hauteur de cette DIV car ils connaissent la hauteur de son parent - mais je suppose que c'est fait de cette façon pour rendre la thématisation et le style plus souple.

Je n'ai pas vraiment une bonne solution de contournement pour vous - peut-être en spécifiant .galleria-stage {min-height: 100%} ou en définissant explicitement sa hauteur à partir de JS? Je vais cependant suivre le bug afin qu'il soit corrigé à un certain moment ..