Bootstrap 3 Diviseur horizontal (pas dans une liste déroulante)

Je sais que Bootstrap 3 a un séparateur horizontal que vous pouvez placer à l’intérieur des menus déroulants pour séparer les liens comme ceci:

  

Ma question est la suivante: y a-t-il un moyen de le faire sans que cela ne soit dans une liste déroulante, comme le placer dans une liste ou un menu similaire?

Oui, vous pouvez simplement mettre


dans votre code là où vous le souhaitez, je l’utilise déjà dans une barre latérale de mon panneau d’administration.

Actuellement, cela ne fonctionne que pour le .dropdown-menu :

 .dropdown-menu .divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; } 

Si vous le souhaitez pour un autre usage, dans votre propre css, en suivant le bootstrap.css en créer un autre:

 .divider { height: 1px; width:100%; display:block; /* for use on default inline elements like span */ margin: 9px 0; overflow: hidden; background-color: #e5e5e5; } 

Comme j’ai trouvé la taille par défaut de Bootstrap


disgracieuse, voici quelques simples fichiers HTML et CSS pour équilibrer visuellement l’élément:

HTML:


CSS:

 .half-rule { margin-left: 0; text-align: left; width: 50%; }