Images on product page are showing up different sizes!

Viewing 5 replies - 1 through 5 (of 5 total)
  • Roy Ho

    (@splashingpixelscom)

    That is because you have this in your CSS:

    div.product div.images img { width:auto !important; }

    That tells your site to fill the space up automatically to the size of the actual image that is being pulled. So if your image is 480px wide, it will be that wide.

    So either you change that size setting in your WC settings, or change that CSS to:

    div.product div.images img { max-width:100%; }
    Thread Starter Sophiemartin95

    (@sophiemartin95)

    Ok thank you, but which CSS? Style, custom or woocommerce?

    Thread Starter Sophiemartin95

    (@sophiemartin95)

    ok i see it but im not understanding what to change it to.

    div.product div.images{float:left;width:47%;margin-bottom:10px;}div.product div.images img{display:block;/*width:auto;*/height:auto;margin: auto;width: auto !important;}
    div.product div.images div.thumbnails{padding-top:10px;overflow:hidden;zoom:1;}
    div.product div.images div.thumbnails a{float:left;width:85px !important;margin: 0 2px 17px 11px !important;}
    div.product div.images div.thumbnails a img{width:auto;height:auto;}
    div.product div.images div.thumbnails a.last{margin-right:0;}
    div.product div.images div.thumbnails a.first{clear:both;}

    That code appears on the WooCommerce stylesheet line 15 – a browser tool like Firebug should help you locate it.

    Thread Starter Sophiemartin95

    (@sophiemartin95)

    Omg Thank You!!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Images on product page are showing up different sizes!’ is closed to new replies.