Collection-repeat shows up as a grid instead of a list for a moment while loading

This issue seems to occur when I switch the view back to the page with the collection-repeat in it, or empty and replace the data in the list. For a split second (on my computer) and much longer (on android) it appears as a grid instead of a list, and if I click back and forth between pages rapidly I can cause it to get stuck - which is how I took this screenshot.

My HTML (why aren't indents showing up?):
<ion-list can-swipe="true">
<ion-item ng-repeat="item in items">
<i class=" item-icon-right">
<i ng-class= "icon ion-battery-full"><\i>
{{item.get('name')}}
</i>
</ion-item>
<div collection-repeat="post in posts" item-width="100%">
<div class="postContainer" >
<div class="card">
<div class="item item-divider">
{{post.get('item').get('name')}}
</div>
<div class="item item-text-wrap">
Text goes here lorem ipsum
</div>
</div>
</div>
</div>
</ion-list>

My CSS:
.postContainer{
padding-top: 10px;
}