How can I turn off auto scaling for images?

Hello all,

Can anyone tell me what CSS code would turn off auto scaling for images within gallery blocks?

According to support the template I am using does not support such a feature and would require CSS. I am willing and (relatively) able to experiment with CSS but am in the dark as to where to start.

My project width is scaled to 1500 which is great for my renders (I'm a computer games artist) but not so great to display my texture maps (some of which are 512 wide) as they stretch up to 1500.

I have forum/google searched to no avail. Any help would be appreciated.

Thanks!-Lee

edit 4/4/13- I have abandoned stacked and am now using slideshow. Images still auto-scale however. There does not seem to be a stable way to turn it off. Very disappointing that something so simple is out of our control. Boo (otherwise awesome) Squarespace!!

This will keep them the original size:

.image-stack .image-wrapper img {
 width: auto;
}

You can also add a min-width to keep them from displaying too large:

.image-stack .image-wrapper img {
 width: auto;
 max-width: 100%;
}

Thank you squaregirl! That is exactly what I was looking for!

Hey squaregirl - Yet another question now. How would I ensure that the images are centered on the page?

Thank you again!-Lee

You could probably text-align centering to .image-wrapper element -- experiment until you get it just how you want it. :)

I'll give that a go. Thank you again!

Ugg, for some reason my images are no longer showing up at their native scale, regardless of the CSS.

Why would the CSS I added no longer effect the images??

I have the same issue, all images are 720px wide in my galleries, and yesterday, no problem, I came back today however and they have all been scaled up and are now blurry. I added the css above, which worked a few days ago before rescaling the images, and still no luck??

So it worked great (thx squaregirl) as far as getting the images to not scale beyond their resolution (width), but is anyone else getting a ton of blank space between the image and the content beneath it now? How do you solve this?

I got that too when it did work, however, it has no stopped working completely and reverting the images to scale up again!

see www.liluxemiami.com to see what I mean.. even though the pictures are now the right size, the image's container still seems to be set to 100% width. Help please!

I got it! I was messing around on my site, with the style editor. If you click "All" and scroll wayyyy down, there is a check box that says "Gallery Auto-Crop"

Hope this helps!

I can't seem to find this option, there is "Product Gallery Auto-Crop" however unchecking this did nothing, as I assume, it relates only to products on a shop page. I think the problem people are having relates to gallery pages on the main page?

Something changed since the solution was posted, this is what works (somewhat) for me.

.sqs-gallery-design-stacked img { attributes }

I say somewhat because a large amount of white space is added beneath the gallery if you re-size the height, and I'm unsure how to fix that.

With almost 2,000 views you'd think they could provide an elegant solution for this. I too would like to know how to turn off the autoscaling.

I feel like I'm stuck between a rock and a hard place:

I need the titles of my gallery pictures to be visible, so I can't use the grid gallery.I can't have my gallery pictures auto scale, so I can't use the slideshow.

I'm still using my trial of Squarespace, and there's so much that I like, but without an adequate answer to this, I won't be giving them my business.

Still hoping for an answer to this!!

2 questions:

Is there a solution for keeping lone images from scaling (not gallery blocks)?

Where are you injecting this string of code if you don't want this to be sitewide?

Thanks!

This actually does not work at all on Bedford.

So, how can it actually be done, hmmm????

Hi @Bumper, I made a video tutorial for you on how to Turn off Auto Scaling For Images. Hope this helps! https://www.askquesty.com/post/turn-off-auto-scaling-squarespace

Anyone figure out how to center align the images?