4 Column Grid Demo – Page 10

[listing class="my-grid-wrapper-4" tools_top=on]


/** CSS Grid for container **/
.my-grid-wrapper-4 {
    display:grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); // Adjust the 280px so suit.
}
/** Span all columns for tools **/
.my-grid-wrapper-4 .epl-loop-tools-wrap {
	grid-column: 1 / -1;
}

/** Width 100% for listing **/
.my-grid-wrapper-4 .epl-property-blog.epl-listing-grid-view-forced, 
.my-grid-wrapper-4 .epl-property-blog.epl-listing-grid-view {
	width: 100%;
}
/** Remove grid under 500px **/
@media screen and ( max-width: 500px ) {
	.my-grid-wrapper-4 {
	display: block;
	}
}