Same Height Blog Grid Articles for Educon II - Forum | JoomShaper
Solved Templates

Same Height Blog Grid Articles for Educon II

Asked by Ubuntu 1 year ago Last activity 1 year ago

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff
1 year ago · edited

Use that Custom CSS (copy all lines)

@media screen and (min-width:  1440px) {
.view-category #sp-main-body .article-list .article 
{min-height: 520px; margin-bottom: 30px; }
    }

@media screen and (min-width:  1280px) {
.view-category #sp-main-body .article-list .article 
{min-height: 580px; margin-bottom: 30px; }
    }

Inside custom.css file, it will help for most laptops & desktops.

4 more replies

Oldest first Newest first Most helpful
Paul Frankowski Senior Staff
1 year ago · edited

Hi,

As you probably noticed so far, all your blog items have different lengths of article titles - which destroys the default grid structure. Only by using extra Custom CSS you can correct that. Because I don't think you want to shorten or lengthen post titles, am right?

But I strongly recommend adding two-three extra words to post title "Resuscitating Stories" at least that small change. Then....

Ubuntu Asked this
1 year ago

Thank you paul..am seekingsupport for that extra custom css to achieve same height regardless the content.

Paul Frankowski Senior Staff
1 year ago · edited

If above CSS will not help, consider adding background color not for .article class as you did orginally, but for column class in grid.

.article-list .col-lg-4 { ...}

But this CSS customization is on your hands. It request adding bottom-margin, paddings inside, etc..

Ubuntu Asked this
1 year ago

Appreciate the support Thank you paul

Log in to reply.