Maison > Article > interface Web > Voici quelques options de titre pour votre article, en gardant à l’esprit le format des questions-réponses et le contenu : Direct et concis : * Menu déroulant dans Bootstrap : comment réparer l'extension du conteneur ? * Huer
Menu défilant avec Bootstrap : résolution des problèmes d'extension de menu
Une tentative précédente d'implémentation d'un menu déroulant avec Bootstrap a entraîné l'expansion du menu dans son conteneur. . Ce comportement n'est pas souhaitable, surtout par rapport au menu non déroulant, qui ne présente pas ce problème.
Stratégies de solution
Pour résoudre ce problème, il existe deux principales approches :
1. Mettre à jour les propriétés CSS
L'ajout simple de propriétés CSS spécifiques à la classe de menu déroulant peut résoudre le problème.
<code class="css">.scrollable-menu { height: auto; max-height: 200px; overflow-x: hidden; }</code>
2. Utiliser les mises à jour Bootstrap
Bootstrap a évolué au fil du temps, introduisant des modifications dans le balisage déroulant. La mise à jour du balisage et du CSS selon la version actuelle peut garantir la compatibilité et résoudre le problème.
Pour Bootstrap 5 :
<code class="css">.dropdown-menu { max-height: 280px; overflow-y: auto; }</code>
Pour Bootstrap 4 :
<code class="css">.dropdown-menu { max-height: 280px; overflow-y: auto; }</code>
Menu horizontal alternatif pour Bootstrap 4 à l'aide de Flexbox
Cette disposition de menu alternative exploite Flexbox pour la conception de menus. Il propose une approche différente pour créer des menus déroulants dans le cadre Bootstrap.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!