- WordPress :6.6
- Statut : non résolu
- Ce sujet contient 3 réponses, 3 participants et a été mis à jour pour la dernière fois par
, le il y a 2 heures et 24 minutes.
-
Messages
-
Bonjour,
Ma configuration WP actuelle
- Version de PHP/MySQL : 8.3.11
- Thème utilisé : Hello
- Extensions en place : Elementor Pro, Solid decurity, WooCommerce
- Nom de l’hébergeur : o2switch
- Adresse du site : en construction
Problème(s) rencontré(s) : Bonjour,
Je suis sur un méga menu avec le widget Menu de Elementor Pro.
J’ai 4 items principaux en horizontal, et j’aimerais que les sous-items s’aligne avec leur item respectif dans l’axe vertical, et ça coince.Dans le conteneur du premier item, le plus à gauche, j’ai mis ça :
selector {
position: relative;
}et dans le conteneur de ses sous-items, ça :
selector {
position: absolute;
top: 100%;
left: 0;
z-index: 10;
}Ça fonctionne pour le premier item.
Pour le deuxième qui est le second en partant de la gauche, j’ai fait la même chose, et je change la valeur ‘left » à tâtons. Est-ce la bonne solution ?
Merci de votre aide.
Salut, comme tu sorts du principe du méga menu (contenu aligné dans le conteneur méga menu), il existe différentes façons de faire, ça peut être une solution.
Quid du responsif ? Ça restera très bancal à mon avis.
Il faudrait connaître les largeurs des premiers menu et leur position par rapport à l’origine du flux HTML référent (parent) et essayer plutôt une règle calc()), mais ça demande réflexion… 🙂
Hi there! I recently set up a mega menu using Elementor Pro for my WordPress site: https://bases-coc.com/ and I encountered similar challenges with aligning sub-items vertically. Your approach with
position: absolute;works well for the first item, but as you noted, it can get tricky for subsequent items. I found that usingcalc()to adjust theleftposition based on each main item’s width helped maintain alignment across the menu. Additionally, considering responsive design is crucial, as adjustments might be necessary for smaller screens. It’s great to see how others are tackling these menu setups—sharing ideas can lead to better solutions!
- Vous devez être connecté pour répondre à ce sujet.