Tagged: , ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • March 15, 2016 at 9:51 pm #598625
    interage

    Hey folks.

    On an iPad, our WooCommerce Products are squished when the screen is narrowed (like in portrait mode.)

    Any way around this?

    http://blastserve.com/newkolstein/product-category/instruments/bass/

    Thanks!

    March 15, 2016 at 10:01 pm #598635
    Yigit

    Hey interage!

    That is because you have following custom CSS code

    #top .thumbnail_container img {
    margin: 0 auto!important;
    height: 350px;
    width: auto !important;
}

    Please remove it. If you remember why you added it, please elaborate so we might be able to provide you another solution :)

    Cheers!
    Yigit

    March 15, 2016 at 10:08 pm #598644
    interage

    Hey!

    I think it was because the product images were getting larger than the actual image size in some instances, and we were trying to keep them from being blurry in that case.

    Thanks!

    Mark

    March 15, 2016 at 11:09 pm #598675
    interage

    Hey…

    March 16, 2016 at 4:57 am #598755
    Vinay

    Hi!

    I guess you have removed the code now because i see the image becomes blur when it is more than 350px.

    You can either upload large images like 600px or something so it looks good but that will double your work to update all the images instead replace the following CSS code 

    #top .thumbnail_container img {
    margin: 0 auto!important;
    height: 350px;
    width: auto !important;
}

    With this code

    #top .thumbnail_container img {
    margin: 0 auto!important;
    max-height: 350px;
    width: auto !important;
}

    The new code will allow the images to be smaller than 350px on mobile and stops at 350px in large screens.

    Regards,
    Vinay Kashyap

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.