Mojave Product Page Single Image Mobile Fix

Hello all,

I'm trying to optimize the mobile view on the Mojave template, for a "Products" page, so that a single centered image appears.

I have the product display set to 3 now - which looks good on a desktop - but want to resize it to 1 image @640px. I can't seem to work it out.

Has anyone tried this before and would you mind sharing your workaround please?

Cheers!

Alex

Can you share link to product page?

Sure, it's - https://solo-adventure.squarespace.com/destinations  and the pass is "password". 

Thanks!

add to Page Header

<style>
  @media screen and (max-width:640px) {
  .ProductList-item {
    clear: none;
    width: 100% !important;
    margin: 0 !important;
}
    .ProductList-image {
    width: 100% !important;
    height: auto !important;
}
  }
</style>

That's brilliant! Thank you so much!! 

If I wanted to have 2 images per row on an iPad, would that be possible?

Thank you again!

7 hours ago, allucaci said:

That's brilliant! Thank you so much!! 

If I wanted to have 2 images per row on an iPad, would that be possible?

Thank you again!

yes, you can with css

Awesome, thanks!