Disable hover in mobile view - bootstrap

Disable navbar hover dropdown in small screen

To disable navbar menu hover dropdown in mobile view and dropdown works when user clicks on the navbar menu, write below code in the  .css file.

@media (min-width: 767px) 

{

    ul.nav li.dropdown:hover > ul.dropdown-menu 

    {

       display: block;

    }

}

Above code ul.nav li.dropdown:hover > ul.dropdown-menu works only when the screen size of the user is 767px and more. if your screen greater than and equal to 767px the navbar menu dropdown works on the hover, else  the navbar menu bar works with the default behavior written in Bootstrap.