How do I put the “Follow” and “Load more” buttons on the same line below the feed?

IN THIS ARTICLE
Contents

Grid and Highlight Layouts

The below CSS can be used to change the footer into a row, centre the buttons, and add spacing between them.

.spotlight-instagram-feed .FeedGridLayout__button-list {
    flex-direction: row;
    justify-content: center;
}

.spotlight-instagram-feed .FeedGridLayout__button-list > *:first-child {
    margin-right: 10px;
}

Masonry Layout

The below CSS can be used to put the buttons on the same line below a feed using the Masonry.

The above will work for the Grid and Highlight layout. If the customer is using the Masonry layout, they’ll need this instead:

.spotlight-instagram-feed .MasonryLayout__button-list {
    flex-direction: row;
    justify-content: center;
}

.spotlight-instagram-feed .MasonryLayout__button-list > *:first-child {
     margin-right: 10px;
}
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.