Zig Zag Product Section

Create a zig-zag product layout with Image & Video. automatically even & odd row adjust in left-right position. you can use this design to show fashion & product content on the website.

using display:flex & its properly arrange layout in the section.after "nth:child(odd)" all section row transfear in reverse direction.

• all the design & layout created in 1920 x 1080 screen size.
• all the design & layout is responsive in desktop,tablet & mobile view.
• all the content, fonts & image are free resources.

I use Fonts from Google font use Bootstrap cdn free stock images from pexels or unsplash

HTML

CSS

Output