Which Boostrap3 grid mode for mobile/desktop do you use?
mobile, responsive-design, twitter-bootstrap
Solution
I think you misunderstand how the grid can be used and you're way overthinking it. The sizes correspond to the way and at what size the columns stack. You can pick and choose and mix it up.
Sometimes it looks better on small devices to stack two images, one after the other. Sometimes leaving them side by side looks better. Just depends on the circumstance and content.
You can choose responsive or non responsive grids if you would like. You can choose to use the img-responsive class on images.
I lifted this little bit from their documentation:
Stacked-to-horizontal
http://getbootstrap.com/css/#grid
"Using a single set of .col-md- grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns in any .row."
And of course you can just use media queries to change whatever you want.
Problem
Bootstrap 3 comes with 4 grid modes: - XS: Extra small devices Phones (<768px) - SM: Small devices Tablets (≥768px) - MD: Medium devices Desktops (≥992px) - LG: Large devices Desktops (≥1200px) In the real world it doesn't depend on the screen resolution but in the device. For example Nexus 5 (1920px) uses XS and an iPad 1 (1024px) uses MD. I want to make the site responsive, but not use 4 modes (as the site is complex, there are parts that are not usable in mobile at all - i.e. complex grid of images-). I just want to use only 2 modes: one for desktop (and tablets) and another for Mobiles. Using Google Canary Emulation mode I found that: - XS: BB Z10 / Z30; HTC Evo, Touch HD, Desire HD, Desire; IPhone 3GS/4/5; Nexus S/4/5; Samsung Galaxy Note / S3 / S4; Sony Xperia S - SM: Amazon Kindle Fire HD 7; Nexus 7 / 7.2 - MD: BB PlayBook; IPAD 1/2/iPad Mini; IPAD 3/4 - LG: Amazon Kindle Fire /Fire HD 8.9″; Nexus 10 (Yep, Ipad 4 with Retina is MD but Kindle Fire is LG) Where should i put the limit between mobile and desktop? I mean: MD and below for mobiles and LG for bit tablets and desktop? or SM for mobiles and the rest for big tablets/desktop?... Thanks!