How much media queries?
How much media queries would you suggest to use?
I've made 4 designs:
960 for landscape-mode (ipad and more like Desktop) 768 for portrait-mode (ipad) 340 for portrait-mode (iphone) and all above 960
Now my questions:
1) First I even don't know why I used 960 and not 1024. I read something a while ago, because of the scrollbar you've to reduce the width to 960. What about this regarding Tablets and Smartphones?
2) I've choosed these widths because I thought, if someone uses landscape mode, it would switch to the "ipad-media-query" and back to the "iphone-media-query". But that's just my theory. I'm new at media queries. That's why I ask. Appreciate any help or even your suggested CSS-code-examples to have the best amount of media queries covered for a website!?
3) I just want to cover most tablets, smartphones, desktops, etc. to be affected by the best media-query size. I would really appreciate your "best solutions"!
How long is a piece of string?
It's really up to you and your design as to how many media queries would be suitable to use and how you implement them.
As a guide I'd recommend looking at how Twitter Bootstrap implement their media queries. They've done a lot of research into it to arrive at their numbers so that would be a good starting point.