Add Classes

Example 3: Offset color cards

We set up 4 unique add-on class pairings to every 4th item to create a very unique offset grid layout.

See Finsweet
Walkthrough

What we will cover

  • The structure of our CMS Collection List

  • Establishing all of the add-on classes on a static structure

  • Setting up our array (list) to hold all of the class pairings. In this How To our add-on classes create an offset color cards layout

  • The .addclasses() component to add unique classes inside the Collection List

  • An explanation of start and frequency

2019
Project 1

Branding, Web Design

2020
Project 2

Branding

2017
Project 3

Web Design

2018
Project 4

Development

2018
Project 5

Development

2018
Project 6

Motion Graphics

2019
Project 7

Branding

2020
Project 8

Web Design

2019
Title

The rich text element allows you stuff.

2019
Title

The rich text element allows you stuff.

2019
Title

The rich text element allows you stuff.

2019
Title

The rich text element allows you stuff.

Clone me!

You are almost there! Clone this template by clicking the link above. Learn, play around, test, use your own content, and have fun.

You can delete all .delete-me divs! All of the How-To content is in the .clonable divs.