Related Posts: line break after every third item

Hi,

I’m attempting to change the amount of Related Posts posts for users visiting on mobile from 3 to 4, so as to make sure the rows of items always fill the width of the screen. The following distribution is my intention, where an asterisk represents a related post:

On desktop:
* * *

On mobile:
* *
* *

I’ve used the following code in my functions.php to achieve this:

function jetpackme_more_related_posts( $options ) {
    if ( wp_is_mobile() ) {
        $options['size'] = 4;
    }
    return $options;
}

This works well, except that Jetpack seems to add a line break after every third item, resulting in the following very odd distribution on mobile:

* *
*
*

For testing purposes, I’ve changed the number of posts to 6 and 12, and the problem persisted in both cases. I’ve also removed all CSS pertaining to Related Posts from my theme’s style.css, but to no effect. However, when I deregistered the entire style for Related Posts, it did display properly, albeit now without any styling whatsoever.

I’d be very grateful if I could get any pointers to what exactly in the Related Posts CSS causes this to happen, and how I could get the items to display properly without losing all other styling as well.

Thanks so much in advance,

Julian

The page I need help with: [log in to see the link]