I have the same question. I would like a rounded square or rectangle. And, I would like to add one more, but have the option to add more as needed. Thanks for the support!
.round-div {
border-radius: 0;
}
should do it. If you want to stop them zooming, then make it:
.round-div {
display: none;
}
@nikeo: for the FAQ:
<li><a href="http://wordpress.org/support/topic/change-the-featured-posts-thumbnail-holder-from-round-to-square">make all the round images square?</a></li>
@electricfeet And how to do the zoom not only to square but the square to have rounded corners? I tried with
.round-div {
border-radius: 10px;
}
or other number of pixels but nothing happens.
Lyubomir, if you look at the css for .round-div you can see its border is 104px for “window” width > 979px otherwise is 94px.
So to see an appreciable result start with a border radius of 106px (96px) and fine tune it. Or use percentages.
Don’t forget to use the right prefixes for different browsers engines,
as you can see here:
http://www.themesandco.com/snippet/featured-images-squared-instead-of-rounded-in-customizr/
I tried many options and I realized that ‘border-radius’ indeed makes the corners of the square round but the OUTSIDE shapes of the corners (which we do not see anyway), not the INSIDE. The zoom effect is made by the inner parts of the square where ‘border-radius’ has no effect. Or at least this is the point I reached. If there is somebody out there that already did it successfully, please, share the snippet.
as I said, tested live on themes and co demo : http://i61.tinypic.com/108dbhh.png
edit:
And this on your site:
http://i58.tinypic.com/t70aj4.png
isn’t what you wanted? Sorry if I failed to understand
Yes, yes, this is exactly what I want! Thank you @d4z_c0nf !!! You are very good!
For me, this topic is resolved but I cannot close it because I am not its creator.
Glad to hear that, you’re welcome 😉
