Site logo

Archived topic

Masonry: space between posts and load more

17 replies · Started by Carlos Paramio on March 9, 2015

Viewing posts 16–18 of 18
/* increase space between elements in desktop view only */
@media screen and (min-width: 769px) {
        /* horizontal space between masonry view and right sidebar */
	.masonry-post .inside-article,
	.separate-containers .page-header {
	      margin-right: 40px;
	}

	/* horizontal space between normal pages  and right sidebar */
	.page.right-sidebar.separate-containers .site-main, 
        .single.right-sidebar.separate-containers .site-main {
    	margin: 20px 40px 20px 0;
	}

	/* vertical space between masonry excerpts */
	.separate-containers .masonry-post {
    	  margin-bottom: 40px;
	}
}

That should do it.

I still don't fully understand why using the separating space in Element Spacing couldn't work for you, but for others looking at this - the above code is basically written for you when you use the separating space option.

Thanks! :)

Once again, it works, thanks
Separating Space wasn't a solution as it includes space between widgets in sidebar, which we wanted to be closer.
Also, this CSS avoids that extra space to appear in mobile devices, a goal we were chasing.

Cheers

Glad it's all good now :)

This archived topic is closed to new replies.