WooCommerce product description does not adjust on responsive

Resolved nrpnrp
(@nrpnrp)

1 year, 1 month ago

Hello everyone, I can’t adjust the product description text in responsive mode. The text overflows the container, and I’ve already tried tweaking margins, spacing, etc., but nothing works. Only the first paragraph adjusts properly; the others don’t, unless I reduce the font size. However, to fit it within the container, I have to set the font size below 6, which is too small to read. If anyone can help, I’d really appreciate it—I’ve been struggling with this for two days now.

The first image shows how the text appears in the product catalog in WooCommerce. The second image shows how it appears in responsive mode, with the text overflowing the container. The third image shows that even when adjusting the margin, only the first paragraph of the text adjusts, while the rest do not.

I’ve tried everything in container editing and product content editing, but nothing worked.

View post on imgur.com

Viewing 7 replies - 1 through 7 (of 7 total)

ckadenge (woo-hc)
(@ckadenge)

1 year, 1 month ago

Hi @nrpnrp,

Thank you for reaching out.

I’m sorry to hear about the issues you’re experiencing with adjusting the product description text in responsive mode.

It seems like this might be a CSS issue related to the third-party theme you’re using, as WooCommerce should automatically adjust the content to fit the screen size. However, as I can notice you’re using Elementor, have you already tried out using a different theme to see if this issue persists?

You can test out with the Storefront or Twenty Twenty-Four theme to see if the issue persists with these themes as well.

Let us know how this goes.

Thread Starter nrpnrp
(@nrpnrp)

1 year, 1 month ago

@ckadenge thanks for your reply.

i will try to do that tomorrow

ckadenge (woo-hc)
(@ckadenge)

1 year, 1 month ago

Hi @nrpnrp,

i will try to do that tomorrow

Sounds like a plan. Please do let us know how it goes.

Thread Starter nrpnrp
(@nrpnrp)

1 year, 1 month ago

Hi @ckadenge

I was using the Hello Elementor theme and followed your suggestion to switch to the Storefront theme, and it worked. However, two new issues have come up.

The thumbnail images are the same size as the main image, and I couldn’t find where to fix this—maybe it’s a theme issue, I’m not sure.

The other problem is that words are breaking by letter instead of by syllable. I don’t know how to fix this.

Here is the screenshot.

View post on imgur.com

ckadenge (woo-hc)
(@ckadenge)

1 year, 1 month ago

Hi @nrpnrp,

From the shared screenshot, this seems to be the mobile preview in your page builder, is that correct? Did you already have the chance to check it from a mobile device once the page was published? If you did, are you finding the same results or otherwise?

Thread Starter nrpnrp
(@nrpnrp)

1 year, 1 month ago

Yes, it’s in the mobile preview. The site is in maintenance mode, so I can’t actually see how it appears on a real mobile device.

ckadenge (woo-hc)
(@ckadenge)

1 year, 1 month ago

Hi @nrpnrp,

Yes, it’s in the mobile preview. The site is in maintenance mode, so I can’t actually see how it appears on a real mobile device.

From my experience, most page builders mobile preview do not mimic the mobile device 100%. It would be best to test this out from a mobile device in order to be able to understand the issue further.

I recommend temporarily making the site live just to make the tests, then revert the site to maintenance mode.

Let us know how this goes.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘WooCommerce product description does not adjust on responsive’ is closed to new replies.