Fix Sort Order of Posts on Mobile for Masonry Layout

[jauyong]

Bug Description

Original Ticket: https://wordpress.org/support/topic/sort-order-of-last-posts-on-homepage/

In the masonry layout in the theme, the columns are two divs which hold all the posts and this changes the sort order for mobile

Note: Verify that this does not occur on the card blocks in the plugin

Expected Behaviour

On mobile, the order the posts are displayed in should be "correct" and match the order displayed on larger screen displays.

Steps to reproduce

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Screenshots

Additional context

• WordPress version:
• Plugin version:
• Gutenberg plugin version (if applicable):
• PHP version:
• OS:
• Browser: [e.g. chrome, safari]
• Device: [e.g. iPhone6]

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

1. On mobile, the order the posts are displayed in should be "correct" and match the order displayed on larger screen displays.
2. Verify that this does not occur on the card blocks in the plugin

Implementation brief

QA testing instructions

Demo

Changelog entry

[jauyong]

@rodydavis to add ways to do this with modern CSS

[emeaguiar]

see https://www.smashingmagazine.com/native-css-masonry-layout-css-grid/

[emeaguiar]

Note that solution in #549 (comment) is no longer valid as it only worked in Firefox and needs to be activated by the user