[Support request] Posts in grid not the same height

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Posts in grid not the same height

Tagged: ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #27318
    Anas
    Participant

    Hi,

    I created a masonry grid (base card) with 6 posts and 3 columns. The problem is that posts with longer titles (i.e 2 or 3 lines) push the posts below them down, as you can see in this screenshot: https://prnt.sc/105wvi1. What can I do to fix this? I tried to increase the bottom margin of posts through CSS but I couldn’t find the right place for that. Could you please suggest any possible solutions?

    Thanks

    • This topic was modified 5 months ago by Anas.
    • This topic was modified 5 months ago by Anas.
    #27340
    elvin
    Moderator

    Hi there

    Any chance you could link us to the site in question to check?

    You can send the site details on the contact page if you wish to keep it private: https://wpshowposts.com/contact/

    #27355
    Anas
    Participant

    I sent the link through the contact form. Thanks.

    #27398
    elvin
    Moderator

    Thanks,

    This is quite tricky to deal with as the issue is coming from title text not being of the same length.

    There are 2 ways of dealing with this:

    1 is to trim the title, meaning it will be cut-off.

    Or we set a min-height so all titles have the same height, which in turn, makes all posts of the same height. But the catch is, the short titles will have significant amount of space underneath them to match the post item height of the posts with longer titles.

    Let us know which of the 2 methods you prefer to do.

    #27428
    Anas
    Participant

    Hi Elvin,

    I would go with the second way (min-high). Thanks for your help.

    #27488
    elvin
    Moderator

    I’m sorry for asking again but can you please link us to the exact page in question?

    I’ve checked the site you’ve linked but I didn’t find anything similar to the image you’ve shared. The site you’ve linked had dark grey background(almania-plus) while the image had white background.

    Perhaps you’ve linked to a different site?

    Anyway, you can try adjusting with this CSS:

    #wpsp-1234 .wp-show-posts-inner {
        min-height: 400px;
    }

    Replace 1234 with the target WPSP list you’ve like this to apply. You can adjust the min-height value to your preference. Fine tune it to what works best.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.