Woocommerce product description cutoff only in Google Chrome

[dap10]

Hi,

Woocommerce product description for products is cutoff with a white box at the bottom of the product description which looks horrible. A product with this issue on the website can be found at:

https://www.coffeecollection.com.au/product/friis-rouge-red-coffee-storage-canister-vault-colour-stainless-steel-large/

Note that only Google Chrome is affected using other browsers such as Firefox or Safari show no problems. Any help with this issue would be greatly appreciated

Thanks In Advance,
David

[kory]

Howdy, David!

Thanks for writing in and I’m sorry to hear that you seem to be experiencing an issue here. This is certainly most strange, as I tried inspecting your page to locate the source of the issue and couldn’t find anything directly that might be the cause of the issue. That being said, there are a couple things I noticed that you may want to take a look into:

1. You have a lot of very intricate and custom markup inside the description box. You may want to double-check all of your code here and ensure that everything has a proper closing tag, there are no syntax issues, et cetera.
2. I’m seeing a few issues coming from the JavaScript console in all browsers related some social media scripts (specifically Twitter), CDN resources, et cetera. Have you tried disabling any plugins you might be using to see if this alleviates the issue? I would try turning anything off you might be using to see if that can help narrow down the source of the problem.

Hopefully this helps to point you in the right direction, cheers!

P.S. As a little side note, you may want to steer clear of utilizing pt units for CSS, as they are rendered inconsistently across various browsers and platforms, so your text that you think is a specific size could actually be larger or smaller depending on who is viewing it. Sticking with standardized CSS units such as px, em, rem, and % are always a safe bet though!