Help reproducing Vice.com responsive-ness

Design help General
1

Hi Webflow people.

I am designing a website that will contain a lot of and various types of content.
Here`s how it ( should ) look.

3rdStage-6
3rdStage-65426×2879 650 KB

I am at the “Responsive Stage”, watched all tutorials, but trying to reproduce Vice.com`s articles section and how all"articles blocks" interact with one another when resolution changes is just out of my understanding how to do :frowning:

Any type of direction on where and how to start actually emulating how Vice did their “responsiveness” for my website would be a lifesaver, guys.

Thank you so much in advance for your help!

Read Only Link
https://preview.webflow.com/preview/thebeginnings?utm_source=thebeginnings&preview=3f8a0f7b464adeedbcf39fe3d943a94d

Published Link
http://thebeginnings.webflow.io/#p2

2

This would be much easier if you were actually using the cms. Collection lists are very responsive by default and can be made more responsive.

Most likely you just need to apply percentage widths to your outer wrapper elements. Then change those percentages for different devices. Ex, 25% on desktop, 33.3% tablet, 50% horizontal, 100% vertical mobile.

Css grid, which will be launched hopefully sometime soon, will make anything you want to do possible without hacking anything.

1 Like