Featured Posts > Featured Image Thumbnails > Odd Resize Behavior

Tagged: featured image, featured posts, Scaling, widgets

This topic has 3 replies, 3 voices, and was last updated 11 years, 3 months ago by Eric.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
January 11, 2013 at 4:31 pm #2412
Photoshopper
Customer
Not sure if this is a theme issue or a Genesis issue, but: if you go to Widgets and drop the Genesis – Featured Posts into “Home Featured Posts”, then within that choose to “Show Featured Image” (150×150, align none)… whether that image is pulled from a featured image in a post, or whether it is pulled from an inline image (in the case that no featured image is present), the thumbnail will actually expand at a certain point, as you scale the window width down in Safari and Chrome. I can’t think of a reason (even if the container has a relative width or something like that) why those images would get anything but smaller.

Basically I have two of these widgets stacked together (to show 6 posts – 3 each) and I don’t see a workaround.

Another example to make it clear: If I take a window and start at 1000px wide (enough to show a 900px slider with some empty space around all the elements on the page), and then resize it to roughly 500px, the size of the featured thumbnails will (instead of scaling down) roughly triple. Shouldn’t all the images in the theme get smaller as you scale the window down (just as the Slider images do)?

I can email a screen video if needed to show what I mean. If this is a Genesis issue, just let me know and I’ll contact the support person there.
January 12, 2013 at 2:44 pm #2433
Eric
Customer
The only way we can suggest what to fix is with an actual link. A screenshot or video won’t work as we would need to see the site itself in order to look at everything.

I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com
January 19, 2013 at 12:12 am #2518
ksthmb
Customer
I’d be interested in a solution for this, too, and have the same problem. I wonder if it’s a mobile responsiveness issue. It seems to happen only on thumbnail images, like on archive pages (or blog pages set to summary).

And as Photoshoppe mentioned, it happens when you pull the corners of a page in smaller — the thumbnail image actually expand and appear distorted as it stretches the thumbnail (so it’s not the full-size image).

It also happens on tablets when you turn them vertically. When you look at the page on an iPad, for example, in the horizontal position everything scales fine. But when you turn the iPad vertically, it scales as if it’s on an iPhone. But it looks wrong on the larger size page. Also, just a few of the letters from the copy show up to the right of the enlarged thumbnail. If you need a link as an example, here’s one from my website (in case Photoshoppe’s site isn’t live yet).

http://savvycities.com/new-york/
January 21, 2013 at 7:44 pm #2551
Eric
Customer
To prevent this from happening you can look for and edit the following in your css –

.featuredpage img, .featuredpost img, .post-image { width: 92%; }

This is what makes the image stretch and adjust to the width of the section/browser…so if you have a small or low quality image it won’t look right if you adjust your browser in the way that you were doing. However, this isn’t really an issue, because most people don’t adjust their browsers when viewing a site so they won’t notice this. If you look at your site on a mobile or tablet device it doesn’t look that bad (from my end at least), it only looks stretched when you resize your browser, which 99% of your visitors won’t be doing when visiting your site.

I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com
Author

Posts