How to scale advertising banners with adaptive layout?

Question

css

For example, for a resolution of 1366 we have a content width of 240*4 + 30*3 + 32*2= 1114.
Where 240 is the column width. There are 4 of them in total, the right one with advertising banners.
30 - distance between blocks.
32 - distance left and right.
We want rubber layout, like here www.vinted.com.
When zooming in and out of the screen, how should the block with advertising banners behave? Is its size fixed or can it be scaled too?
And how to choose the maximum and minimum size for a column?
In order not to shrink, and not to annoy with huge blocks ...
And do I understand correctly that for resolutions less than 1000, a separate story begins with its maximum and minimum sizes?

Answer 1

At a resolution of 1920-1366-960px (destop banner)
780-480, the banner should not increase much, in height + rebuilding the banner itself to this size
. Anything less than 480 is just a proportional reduction of the banner.
Here is an example of how this was implemented on the Megafon website.
Yes, you will need to make a bunch of versions for different screens. Or you can do as I wrote above.

Answer 2

Ah, there is a desktop version, there is a mobile version.
Bigger picture on desktop, smaller picture on mobile.
Long live the classic!

Answer 3

Owl Carousel .