Topic: Different margins around featured image

Leonardus
February 6, 2024 at 3:51 am

I’m updating my website from GP Premium Versie 1.12.2 to GP Premium 2.4.0. I make necessary adjustments in a testsite before I’ll update the “real” site.

On the homepage (left in the picture) the featured article has double column width and should have a bigger (not square) featured image. (The other stories on the homepage have a square featured images, that works fine.)
If you click “Lees verder”, you’ll go to the post page (right in the picture). In the original site this worked nicely, but now the margins and the size of the featured image change.
The post page has the desired right and bottom margins for the featured image. (I’ve fixed the smaller space between date and image.)

I added the relevant extra css in the private information.

Thanks, Leon

David

February 6, 2024 at 5:39 am

Hi there,

add this CSS to get rid of the additional margin on the post image container:


.generate-columns-container .featured-column .inside-article .post-image {
    margin-right: 0;
}

Then in this CSS:


.featured-column .post-image img {
    width: 325px;
    height: 100%;
    margin-top: -4px;
    margin-bottom: 10px;
    margin-right: 20px;
    float: left;
    object-fit: cover;
}

You can adjust the width: 325px; to match the other site which is 275px

Leonardus
February 6, 2024 at 7:55 am

Thanks David,
It’s fixed now.
Kind regards, Leon
David
February 7, 2024 at 2:15 am

Glad to hear that !

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

Different margins around featured image