Introduction

Here we are showing how to make divi blog equal height with using only CSS

Before:

After:

Step 1:

Layout Design should be full width. Please confirm once.

Blog Module > Design > Layout choose full width

Divi Blog Equal Height – Step – 1

Step 2:

We can achieve this via using only CSS. 

Customize > Additional CSS add below code

/*  Blog equal height*/

.et_pb_posts .et_pb_post {
    position: relative;flex-basis: calc(33.33% - 20px);margin: 10px;box-shadow: 0px 0px 4px 1px #00000030;    padding-bottom: 20px;}
.et_pb_ajax_pagination_container{display:flex;flex-wrap: wrap;}
.et_pb_posts .et_pb_post h2, .et_pb_posts .et_pb_post .post-meta, .et_pb_posts .et_pb_post .post-content{padding:0px 15px}
@media only screen and (max-width: 767px) {
  .et_pb_ajax_pagination_container{
   flex-direction:column
  }
}
Divi Blog Equal Height – Step – 2

That’s all…

Now save and refresh your blog

Conclusion

We really wanted to help you with some customization on Divi, Elementor, Shopify, WordPress and CSS. If you have any difficulties above topics contact us or Comments below we will fix on that and update you

Subscribe Now

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments