Wider product images cut off on right, but only with firefox

  • Resolved palomnik

    (@palomnik)


    5 years, 9 months ago

    Greetings,

    I cannot determine the proper Mozilla/Firefox CSS addition to keep this from happening: With product images, everything works find in every browser but Firefox. In Firefox, most images display properly, except for the extra wide images.

    For example: go to: https://cbd-united.strannik.dynalias.net/product/proprietary-hemp-extract-blue-label-15-18-cbd/

    Among the images in the gallery on the left, select the bottom label which is the widest It will appear to be cut off/cropped on the right side of the image, only displaying about 80% of the image. I did a fair amount of tweaking to CSS for products, and everything is as it should be, except for wider product images on firefox. Any insight into this problem would be appreciated.

    Thanks,

    John

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Support RK a11n

    (@riaanknoetze)

    Hi there,

    While custom CSS support falls outside the scope of what the WooCommerce support forum is intended for, it looks like the DOM is calculating the widths for “100%” differently. Compare the following screenshots:

    Firefox


    Link to image: https://cld.wthms.co/ATVIko

    Chrome


    Link to image: https://cld.wthms.co/I4REdb

    You’ll want to dig deeper on how block-level element widths are calculated on the two browsers when using 100% width.

Viewing 1 replies (of 1 total)
  • The topic ‘Wider product images cut off on right, but only with firefox’ is closed to new replies.