Infinite scroll not working as intended.

Hello.

I am using the jetpack plugin in my Radiate Pro Theme from Theme Grill.

The reason I use this plugin is at first for the infinite scroll.

This was working, but due to setting the first posts the page shows to random, it will duplicate a certain ammount of posts(the posts it allready shows on initial load for the page). Why? I do not know…

Now I changed the page some more, to instead of having one column, it now has 2 columns to show the content. When doing this, infinite scroll breaks. It does not work at all anymore.

Here is the custom CSS i use for this page. Is there a way to still have the infinite scroll on 2 columns?

/*Multiple Content Colums for home category and archive pages*/

.home .content-area {
	  -moz-column-count: 2;
	  -moz-column-gap: 20px;
	  -moz-column-rule: none;
	  -webkit-column-count: 2;
	  -webkit-column-gap: 20px;
	  -webkit-column-rule: none;
	column-count: 2;
	column-gap: 20px;
	column-rule: none;
	}

.home article {
-webkit-column-break-inside: avoid;
          page-break-inside: avoid;
               break-inside: avoid;
}

.category .content-area {
	  -moz-column-count: 2;
	  -moz-column-gap: 20px;
	  -moz-column-rule: none;
	  -webkit-column-count: 2;
	  -webkit-column-gap: 20px;
	  -webkit-column-rule: none;
	column-count: 2;
	column-gap: 20px;
	column-rule: none;
	}

.category article {
-webkit-column-break-inside: avoid;
          page-break-inside: avoid;
               break-inside: avoid;
}

.archive .content-area {
	  -moz-column-count: 2;
	  -moz-column-gap: 20px;
	  -moz-column-rule: none;
	  -webkit-column-count: 2;
	  -webkit-column-gap: 20px;
	  -webkit-column-rule: none;
	column-count: 2;
	column-gap: 20px;
	column-rule: none;
	}

.archive article {
-webkit-column-break-inside: avoid;
          page-break-inside: avoid;
               break-inside: avoid;
}

Thanks!

https://www.ads-software.com/plugins/jetpack/