[Support request] Consistent sized images on homepage

[Casey]

On my homepage I have some latest posts showing (4 in total). All used to display a consistently sized feature image. Now they are all different.

Not sure what I have changed but would love to bring them in line

website is http://www.golfdrifter.com

[Elvin]

Hi Casey,

Not exactly sure what you mean by “bring them in line”, but as for applying the same size/aspect ratio for all the images within the WPSP list you have, you can add this CSS:

.wp-show-posts-image {
    position: relative;
    padding-top: 75%;
}

.wp-show-posts-image img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: auto;
    object-fit: cover !important;
}

There will be a bit of cropping that will occur to keep the aspect ratio.

As for keeping them aligned:

That’s quite tricky to do because the culprit is the variation of title lengths. Some title go as long as 3 lines while others only have 1 line. This means some images will be pushed further down ( titles with 2 lines or more).

My suggestion:
You can truncate the title text so it always occupies only 1 line but I’m not sure if this is desirable.

[Author]

Posts