Featured image and post thumbnail issue – image cut off?

carrieatmint · Member · December 18, 2013 at 5:35 pm
Copy link

Add topic to favorites
I’m using a featured image for my posts at the recommended width & height and it displays just fine in the slider, but the thumbnails for my post previews below the slider area look funky. Specifically they’re cut off from the left. If you scroll down on my blog you can see some other thumbnails that show just fine, but I haven’t made any changes to the CSS since well before any of these posts were published (except for today, messing around trying to fix this problem).

Does anyone have an idea of what might be causing this?

The blog I need help with is: (visible only to logged in users)
tollmanz · Member · December 18, 2013 at 11:20 pm
Copy link
Hi Carrie!

That certainly is odd. It does not look to be a CSS issue; rather, the image is just cropped incorrectly. Can you try re-uploading the image to see if that fixes the problem?
eskernikkit · Member · December 30, 2013 at 9:43 pm
Copy link
I experience the same problem. I have tried resizing the image with CSS coding that allows the image to be moved down to therefore allow the thumbnail to not be cropped, but it also effects the slider image and causes there to be a large white open space at the top of the slider image.

Is it possible to have CSS coding that effects just the thumbnail and allows the thumbnail image to be sized appropriately?
incidentallypinabaft · Member · December 31, 2013 at 5:30 am
Copy link
Hello Carrie and eskernikkit!

Sorry to hear about this problem. Can you please publish a new post with a different thumbnail image? This way, we can test if this is an issue with the specific image you’re using.
eskernikkit · Member · January 2, 2014 at 3:23 pm
Copy link
The blog that went live this morning has a different thumbnail/featured image. It is made sticky as well, so that it appears in the slider.

I’m anticipating that you will inform us that we have to be selective of the images that we are using (nothing too wide, and nothing with text too close to the top of the image). However, if would be so wonderful to have a CSS that allows the thumbnail image to be resized, as to not have to worry about the image being cropped all funky. Considering that an image that is wider works best for the slider image…

Thank you!
Kalyn
carrieatmint · Member · January 2, 2014 at 3:38 pm
Copy link
Thank you for the suggestion on changing the image – the problem I was having was solved by saving the image as a jpg instead of a png with a transparent background. I wonder if it was the transparent background causing the issue?
incidentallypinabaft · Member · January 3, 2014 at 5:06 am
Copy link
@Kalyn, you’re right. I think this problem is caused by your panoramic image. To fix this, you’ll want to adjust the aspect ratio of your image—4:3 preferably. Because this is controlled by the template itself, it cannot be overridden with CSS, unfortunately.

@Carrie, glad to hear this was resolved, and thanks for sharing your solution. I don’t believe the transparency is causing this issue. Likely the change in file format fixed the problem you were noticing.

No items found.