Featured image size in posts

Hi,

what is you site link?

Hi! It’s still under construction…. don’t have it live yet. I can make it live so you can check it — let me know when you do so I can then put back in “under construction” mode! thanks!
https://www.anpacpibembibre.com

see “NOVAS” page — that is where I am unhappy with how the images are differnt sizes and way too big in some cases…

This code will make the images proportionally smaller with a max height of 100px, but I don’t think it’s exactly what you want.

a.feature-img.radius-top img {
    max-height: 100px;
    width: auto;
    margin-top: 30px;
}

Just add it to the bottom of your css file to ensure it gets read last and overrides any previous styles.

that’s a bit better, thanks! But not exactly what I am trying to achieve… Any ideas on how to force the featured image to be cropped so that it extends the full width?

I guess in that CSS I could also set a specific width… but that would stretch it of course… Hmmm…

I prefer to use the css property ‘background-image’ to have a little better control over stuff like that, but that would require rewriting some code in the template files…

You can tell the parent container to be set to a certain height and hide anything larger than it, and then tell the image inside to stretch to the full width of that container whilst maintaining proportion.

a.feature-img.radius-top {
    overflow: hidden;
    max-height: 120px; /* the height of the container */
}
a.feature-img.radius-top img {
    width: 100%;
    position: relative;
    top: -110px; /* this will change the images position within the container */
}

and don’t forget to delete that last portion of code you tried.

That is perfect!! Thank you so much.