Tagged: masonry
Hi guys
I’ve setup a masonry on a page, and set to pull from a specific blog post category. I’ve set it to “Perfect Grid” setting, as I want it to display in clean, orderly rows where each entry is the same size (including title & description).
I’ve got it nearly exactly how I want it, however I noticed the post thumbnails are “zoomed” – ie it’s not displaying the full image. This results in some unusual images – you can’t really tell what the subject matter is etc.
I don’t know why this would happen, as I made sure the “Featured Image” for each post in that category was the exact same size.
Is it because I haven’t gotten the correct dimensions for my images? Please advise best dimensions, and I can create the images to suit.
Thanks!
Hi adapt,
Please try to add this CSS code in Enfold > General Styling > Quick CSS:
#top .av-masonry-outerimage-container .av-masonry-image-container {
height: 54%;
}
Best regards,
Nikko
Hi Nikko
Thanks for the response. That does fix the issue with the images, so thank you for that.
The only problem is that it meant it created a fairly large gap between the thumbnail and the title, so I modified your suggested 54% to 70% instead, and that seems to have helped.
It means the images are “mostly” recognizable (they are still a little “zoomed in”), and the gap between the thumbnail and title isn’t so big that it’s noticeable, so that’s the best compromise for now.
Thanks once again :)
Hi adapt,
We’re happy that we could help :)
Thanks for using Enfold and have great day!
Best regards,
Nikko