-
I would like to add a border radius to featured image of my blog posts showing at the top of each single post.
I tried doing this through custom CSS:
.featured-image {
border-radius: 5px;
}That didn’t work. The featured image is set to show automatically so it’s not inserted as a block in the post editor. I tried to disable that and inserted the featured image manually in my posts. The same CSS or even the container in which the featured image is still don’t change the border-radius.
-
Hi there,
can you share a link to where i can see the issue on your site ?
-
https://themanduls.com/blog/dao-falls-samboan-cebu/
The featured image is the first photo.
-
I only managed to make it work by inserting an image element and using dynamic data to show featured image. The image element has border radius set to 2px.
Is this okay or is it better to find a different solution that would apply the border radius directly to featured image which was showing automatically?
-
If you leave it to display the default featured image, then add this CSS to your site:
.single .featured-image img { border-radius: 12px; } -
Perfect thanks a lot!
-
You’re welcome
-
Hi David,
CSS code you sent earlier stopped working. Do you have any idea what might be wrong?
thank you for help.
-
Theres a bad space character in the CS thats breaking the CSS.
Can you delete the CSS and copy and paste it again from here:.single .featured-image img { border-radius: 5px; } -
That fixed it, thank you
-
Glad to hear that !
- You must be logged in to reply to this topic.