What are the screen sizes?

Question

css

I am currently building a responsive website. With the libraries of experiments, I already had enough. I use pure css. but this will have to set the dimensions at which css is connected with handles. I have five files: smartphones, tablets, small monitors, large monitors, and general. Well, in general, the question itself is: what sizes to ask for each of the 4 styles?

Answer 1

use pure css

better unclean less/scss
Much easier not to worry about different devices. Lots of devices. There are phones with a screen like a tablet and tablets with a screen like a phone. There are those who like to rotate the monitor by 90%, there are smart watches with browsers, there are microwave ovens with browsers ...
That is, we take a browser and resize the window ... and look at what resolution everything is bad and what is good. We rebuild the elements after reaching a certain threshold. The sizes nevertheless from design and the task are set.

Answer 2

+100, the answer to your question: screens are different and should ideally look good on everyone, so we take the browser and resize where it breaks - we make a breakpoint - yes, the minus is that you can’t spread it into different files, but take it preprocessor in hand and forward - everything is conveniently written right into the ladder.

Answer 3

Also read about what a viewport is and why on mobile devices 1px is not what you might think.

Answer 4

Here is the answer !

Answer 5

I use three sizes for CSS media:

$small: 0; //480px and below
$medium: 30em;
$large: 48em;

Can you add more
$extralarge: 75em;

Answer 6

quirktools.com/screenfly
enter your site address, up to the fact that you can localhost
and immediately in the menu size

Answer 7

>>>>> What are the screen sizes?
Already any, you just need to make it look good everywhere, in Firefox-e you press ctrl + shift + M, and you start resizing. )))