How to adjust minimum height of Divi blog post grid tiles for consistency

Dec 5, 2017 | Blog, CSS tweaks, Divi Theme

Due to different title lengths, post summaries in the grid format may display with varying heights. For consistent heights on each grid tile across the rows, adjust the minimum height with the following CSS:


/* Adjust Post Tile Height */
.et_pb_post {
min-height: 340px;
}

 

You may also need to adjust for mobile screen sizes, if the height looks too big or too small:


/* Adjust Post Tile Height */
.et_pb_post {
min-height: 350px;
}

@media all and (max-width: 767px) {
.et_pb_post {
min-height: 280px;
}
}

 

Where to paste the CSS snippet

Navigate to Divi>Theme Options and at the bottom of the default “General” tab, paste the CSS snippet into the “Custom CSS” box and save changes.

 

Child Themes

We recommend using a child theme. It is your insurance against losing your custom work in updates. Click here for instructions on adding a basic Divi child theme with a stylesheet (for custom CSS). Click here to learn more about child themes and getting the most out of the Divi theme.



			

Want more module options for your Divi website?

Check out our Custom Modules for Divi
Browse Custom Modules