grid with alternate number of items row
I got a UI design acutally from a printing press, there is a section, with multiple items and they are arranged like 3 items in odd rows, and 4 items in even rows:
i.e.
3 in first row
4 in second row
3 in third row and so on
how can I build it using css flexbox or grid ?
3 Replies
Also for responsiveness it should be 1 item in odd and 2 items in even rows
think you'll need some media queries to make this happen.
make an 8 column grid
let each item span over 2 columns
let the 1st and 8th item start at the second column
you will need to adjust that for each media querie (can not see another option)
here a small example
https://codepen.io/MarkBoots/pen/mdvmgYO
@MarkBoots You are awesome. Thanks for helping. Appreciate that.