I felt that Bootstrap 2.3 was too limited when it came to hide and display elements depending on device, so I extended them a bit.
The current CSS classes to hide and display content depending on device doesn’t really work as they should (in my opinion) and they don’t differentiate between portrait and landscape. They don’t even differentiate between devices, they only differentiate between browser window size.
In my opinion, when doing responsive or adaptive design, you don’t design mobile menus so that they are accessible from a desktop computer. That is just redundant work and misses the point. Normal people don’t resize their desktop browser to 320×640.
My solution to the problem
I decided to write a CSS that easily overrides Bootstraps original rules with my own. It’s very easy to implement and provides a lot more flexibility when it comes to hiding and displaying content depending on device and device orientation.
What about Bootstrap 3?
I plan to make this for the new Bootstrap 3 as well, but currently it’s only available for Bootstrap 2.3