Owl Carousel Centering Mobile Layout

J'ai une page web formatée avec jQuery mobile qui utilise Owl Carousel & Photoswipe et il me donne des problèmes lors de la visualisation sur les tailles mobiles. Le problème est que, sur un téléphone portable de format portrait (IPhone 5), l'image affichée est décentrée. J'ai remarqué qu'il y a du Javascript en appliquant le style inline à l'ul avec la classe de .owl-carousel.owl-theme qui définit l'affichage à bloquer. Si je le mets en ligne pendant le débogage de la page dans Mobile avec les outils de développement dans Chrome, l'image est correctement centrée. Si j'essaie de le coder en dur dans le CSS, toutes les images sont empilées les unes sur les autres et vous ne pouvez cliquer que sur une image (ce qui est un comportement incorrect puisqu'il y a trois images dans le carrousel/la galerie).Owl Carousel Centering Mobile Layout

Est-ce que quelqu'un sait quel est mon problème et comment le résoudre de sorte que si vu d'un périphérique mobile en mode portrait (quand une seule image de carrousel est affichée) l'image est centrée correctement sur la page? J'ai d'autres pages avec des CSS similaires pour le carrousel (mais pas jQuery Mobile) et quand vu sur un appareil mobile le comportement est correct, donc je suis perplexe! Merci pour toute aide donnée!

Source

2017-07-12 finiteloop

Essayez cette CSS

CSS

ul.owl-carousel{ 
padding:0; 
text-align:center; 
}

espérons que cette aide ..

Source

2017-07-12 08:52:54

Fermer. l'image semble centrée correctement dans le mobile maintenant, mais une fois que je reviens à la vue normale du navigateur dans les outils de développement, les trois images de la galerie perdent la marge entre chacune. C'est un scratcheur de tête. Je vais frapper le foin et revenir demain. Il est tard ici! :) Merci de votre aide! Cela pourrait me rapprocher demain quand je reviendrai et réessayerai! – finiteloop

@finiteloop a mis à jour le code. Essayez-le –

Je pense que j'ai compris cela maintenant. Je n'ai pas utilisé votre code modifié. J'ai utilisé ce que vous avez déjà mis en place et j'ai supprimé certains CSS qui étaient appliqués à un point d'arrêt. Je l'apprécie énormément! Je voterai pour votre réponse avant si vous changez le code à ce qu'il était. :) – finiteloop

Owl Carousel Centering Mobile Layout

Répondre

Questions connexes