I have created my own theme from Bootstrap 3, everything went ok except for the navigation. After many hours trying ot figure out why my navigation didn’t drop down, I finally fixed and thought that was job done… (I hadn’t used a navwalker), but now I find the dropdown only works when clicked (expand and retract), and the items are not in a vertical list but horizontal (wrapping to the container).

Can anyone please advise how I change the action from click to hover, and also how do I get the sub menu to list horizontally?

Thanks Tony

  • This is how Bootstrap's dropdowns work. There's nothing going wrong. I strongly advise you leave it that way, because it was a deliberate choice made by very knowledgeable developers. From experience I can tell you it is basically impossible to get hover-based dropdowns to work correctly across all the types of devices that are available today (tablets, touch PCs, touch PCs connected to non-touch monitors, etc.). Commented Jan 24, 2019 at 9:07

1 Answer 1


Please add below code inside your css file.

.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; // remove the gap so it doesn't close

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.