Fluid wrapper

Hi everyone, hope you're doin well! 🙂

I've got a requirements where I should set based on different viewports width, the width of a wrapper container.

Here's the list of breakpoints:

- From 1440 to 1583 it should adapt to the viewport's width with left and right margin of 64px

- From 1584 to 1919 same as before, but with a right and left margin of 72px

- From 1920 to 2560 it should be 80% of viewport's width

- Above 2560 it should be the 80% of 2560 (2048, basically)

I did a first try using media queries to do so, but I wasn't that happy with the result, cause it wasn't that fluid.

I was thinking of using calc() for doin the math, but I'm not quite sure.

I'm 100% sure that the minimum width of the wrapper is 1312px and the maximum is 2048 (as I said in the last point)

Any suggestion? Thanks in advance
Was this page helpful?