Bootstrap 3: Прекращение наведения на мобильных устройствах

Question

У меня есть следующий код css, чтобы мои подкатегории заголовок отображались при наведении, который выглядит действительно замечательно на настольной версии сайта, но выглядит ужасно на мобильном телефоне или когда экран снижается. Каков наилучший способ заставить его перестать использовать следующее поведение на мобильном сайте?

.dropdown-menu li:hover .sub-menu { 
    visibility: visible; 
} 

.dropdown:hover .dropdown-menu { 
    display: block; 
} 

Заранее спасибо

Answer 1

Если это просто малый форм-фактор, что эти стили являются проблематичными, вы можете обернуть их в маленькой Bootstrap точки останова медиа-запросов, чтобы гарантировать, что они не относятся к меньшему размеры:

@media(min-width:481px){ /* hover rules */ }