How to do responsive design?

Question

css

Hello. I am studying layout and began to think, what is the ideal way of adaptive layout?
1) Media queries (manually). It is often possible to respect block parameters on a pixel-by-pixel basis, which provides an exact copy of the layout. But is it efficient to write all parameters for each permission manually?
2) Frameworks. Studied Bootstrap, already made 1 site adaptively (inter-space.ru). Here you will have to put up with the standard sizes of the columns, which does not allow you to keep the proportions of the design. Of course, you can split columns into columns, but I still don’t know how to align the whole thing well.
3)Flex box. I haven't made layouts with flex boxes yet, but I see huge advantages in using these features. It can be easily responsive. place blocks in a row as you like, much more. But, as far as I know, not all browsers support this technology, which makes flexbox a crude but promising solution.
All the same, gentlemen, I would like to know your opinion and get advice on which direction it is better to move in order to make adaptive design quickly and with maximum efficiency.

Answer 1

Bootstrap is a perversion that was invented by programmers who do not know how to typeset :)))
The only use of this Framework is layout of admin panels and interfaces.
If you need a frontend, then typeset with pens, with high quality and reliability.

Answer 2

Why don't you like pure CSS?
Almost ANY page can be laid out responsively. True, in order to be fully adaptive (i.e. adapt both to the client and when adding content), you need to work hard. However, this is quite real.

Answer 3

everything is simple - layout for bootstrap, typesetting for bootstrap. layout not for bootstrap - typeset manually

Answer 4

Sass + Susy + Flex

Answer 5

Somehow you mixed everything together.
Frameworks use the same mq for responsive design and don't need to be considered a layout. I think if you have a similar question, then it’s even harmful for you to get into frameworks, first learn to cope without them, otherwise I saw a couple of times at interviews of people who answer the question “Why do you have this in each block” answer “I don’t know , but it was like that in bootstrap.” In addition, you can adaptively layout using display-inline. float (yes, just take a block and it will shrink itself after the browser window if you do not define a width for it :) ), it all depends on what exactly you want to do. There is no single solution, somewhere it will be more convenient to make flexboxes, somewhere there will be enough floats. And only without MQ, perhaps, you can not do :)
Flexbox is not a raw solution at all, if I'm not mistaken, the final specification has already been released, and it has sufficient support - (canius shows 95%). In older browsers, it will never (out of the box) be, but this is not a reason to consider flexbox raw.

Answer 6

I myself work with the adaptation of sites. Media queries + small changes to the block styles themselves. It’s not particularly difficult, and it’s not necessary to connect all sorts of frameworks for adaptation, as for me.
Or, the universal option is to immediately typeset an adaptive template, setting the maximum width, etc.