How Can I Enlarge Product Thumbnails While Retaining Their Aspect Ratio?

I've got another question. What css can I use to increase the size of the product thumbnails?

As an alternative to increasing the size of the product thumbnails, we have a widget which displays each product in a lightbox when clicked, like in this demo. The widget is named Product Lightbox. Here's our guide on how to add widgets to your JotForms.

Do inform us if we may help you with anything else JotForm related.

Ciao for now and enjoy your weekend :)

I just want to permanently increase the size of the images. I got them to be larger but how do I make them proportionally larger so that they aren't distorted?

Let me see what's the best CSS I can come up with to achieve this and get back to you later today.

Thanks

Hi again,

It turns out that the solution is actually quite simple. Just changing part of the value of the last declaration in the last rule of the form's injected CSS, so that the rule becomes

.form-product-image-with-options {
  width: 200px !important;
  height: auto !important;
}

will do the trick, as can be seen in this clone of your form. To simplify matters, just delete all of your form's injected CSS, copy this code to your computer clipboard and paste it in place of the deleted CSS.

Cheers

UPDATE

Neither the height declaration nor !important keyword is necessary. Just

.form-product-image-with-options {
    width: 200px;
}

would suffice.