Comment harmoniser les hauteurs de colonne avec des images sur Divi ?
Dans le builder Divi, vous avez la possibilité de créer des colonnes. Vous pouvez intégrer différents éléments à cet endroit.
Toutefois, si vous intégrez des images qui n'ont pas été retravaillées en hauteur avant l'intégration dans la bibliothèque de médias, vous risquez de vous retrouver face à des différences de hauteur entre vos images. Ce qui n'est pas très esthétique, comme vous pouvez le constatez dans la capture d'écran ci-dessous.
Pour régler ce problème, nous allons procéder à 2 manipulations très simples.
Pour commencer, nous allons effectuer des réglages dans la rangée.
Réglages de la rangée
- Aller dans les réglages de la rangée
- Dans "style"
- Puis dans dimensionnement
- Activer "oui" dans la catégorie " harmoniser la hauteur des colonnes"
La hauteur des colonnes est à présent harmonisée pour la rangée. Si vous souhaitez, par exemple, ajouter un texte dans cette rangée sous les images, cette manipulation vous permettra d'avoir un texte bien aligné sous les 3 images.
Maintenant, nous allons régler la hauteur de chaque image.
Réglages de la hauteur de chaque image
Nous allons partir de la hauteur de l'image la plus petite.
Dans le cas présent, il s'agit de la photo du gateau à droite
- Paramètres du module de cette image
- Aller dans "style"
- "Dimensionnement"
- "Hauteur" : regarder la hauteur initiale de cette image, ici 205 px et réutiliser cette taille pour modifier la hauteur des deux autres photos
Nos 3 images sont désormais de la même hauteur.
Vous pouvez retrouver l'ensemble de ces manipulations dans le tuto vidéo ci-dessous
Autres articles qui pourraient vous plaire
Créer une page de contact qui convertit : la méthode pas à pas
La page contact est l’une des étapes les plus stratégiques du parcours utilisateur. Lorsqu’elle est claire, rassurante et bien structurée, elle facilite la prise de contact, améliore la qualité des demandes reçues et renforce la crédibilité de votre activité. Offrez une expérience fluide à vos visiteurs et augmentez vos conversions !
Renforcer la sécurité de votre site WordPress : 5 étapes efficaces et simples pour les entreprises
La sécurité d’un site WordPress reste l’enjeu majeur de toutes les entreprises, quelle que soit leur taille. Les hackers ne lésinent pas et ne regardent pas à la taille pour subtiliser les données cruciales des sociétés et de leurs clients. Pourtant, renforcer la sécurité de votre site WordPress n’exige pas forcément de compétences techniques avancées.
Tendances Web : ce qui va changer ou pas pour votre site Internet (WordPress, SEO, IA…)
Augmentez vos ventes et fidélisez vos clients en mettant en place la livraison gratuite sur votre boutique en ligne. Suivez un tutoriel pas à pas pour configurer cette option dans Woocommerce et offrir une expérience d’achat optimale.