Using the WP flexbox grid
.
A ul is given the following classes: class=”is-flex-container columns-3 wp-block-post-template is-layout-flow”
CSS being applied is
.wp-block-post-template {
list-style: none;
margin-bottom: 0;
margin-top: 0;
max-width: 100%;
padding: 0;
}
.wp-block-post-template.is-flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 1.25em;
}
.wp-block-post-template.is-flex-container li {
margin: 0;
width: 100%;
}
@media (min-width: 600px)
.wp-block-post-template.is-flex-container.is-flex-container.columns-3>li {
width: calc(33.33333% - 0.83333em);
}