Custom CSS: Misaligned Posts in a Row

IN THIS ARTICLE
Contents

The below custom CSS will help you create the effect of misaligned posts in a row. The rounded corners and shadows are applied as shown here. This is possible using
the free version of Spotlight only.

.FeedGridLayout__cell:nth-child(2n) {
    transform: translateY(-24px);
}

The example below is showing 6 posts in 6 columns (with the “Row” template) and 14px of image padding. Here’s what the end result looks like:

You’re free to use the above CSS code or customise it as you wish.

The code can be added to either your theme’s style.css file or in the “Custom CSS” section under Appearance > Customizer.

GIVE FEEDBACK

Was this article helpful?

Still stuck?

Instagram Feeds Lookbook

Free Download

Instagram Feeds Lookbook

Get inspired by nine of the best use cases of Instagram feeds from real Spotlight users.