4

Bootstrap 3 claims to be mobile-first. However, the hover styling is totally inappropriate on mobile devices. For example, I don't want the link in the navbar to still show as "hover" style after user clicked it. The user is not hovering the finger over the button anymore! Please let me know how can I disable all hover styles in bootstrap? (And also why is it called mobile-first then, if it doesn't make sense for mobile by default?)

akuz
  • 607
  • 7
  • 14

1 Answers1

3

It remain with the "hover" appearance for usability reasons. If it was not identified as active, people may not know to click it again to hide the menu. If you didn't notice, the menu stays open until you click a link, or click the menu button again to toggle it.

Also, some mobile devices do recognize hover.

If you still want to remove the style, just add an id to the button, and override the styles.

Mark
  • 4,773
  • 8
  • 53
  • 91
  • Thanks! I guess I'll just have to go with material design then: https://fezvrasta.github.io/bootstrap-material-design/ – akuz Apr 16 '15 at 12:56
  • 2
    I just don't want the hover to work on mobile... I have a button in toolbar that opens and closes the side menu, and it doesn't look good if it's still in hover state after the menu is closed (until the user clicks somewhere else) – akuz Apr 16 '15 at 13:48
  • Then like I said, just over-ride the style? – Mark Apr 16 '15 at 13:54
  • I have other buttons for which I would need to do that, and for which I would set active class through data binding. Additionally, I'm using custom theme from bootswatch, and I would need to look for exact colours to reset to? – akuz Apr 16 '15 at 13:57