Browser: Arc + Chrome + Safari
OS: macOS
URL: Product page
Video: jam video
I have a Woocommerce product page that has the product gallery next to the product title, price etc. This was initially set up as grid with 1.5fr 1fr widths for the respective columns, after a suggestion on the Facebook group I’ve changed it to flex with a width percentage but unfortunately no solution seems to help with my issue so it might be a bug.
What happens is the gallery will not scale down when you scale down the window; whenever you refresh it’ll snap to the right width but while scaling down the window it’ll keep the same width and push out the column holding the title/info stuff.
Hi,
Thanks so much for your report!
We’ve already received a report about the unresponsiveness in a CSS grid, but unfortunately have not yet found a solution: WIP: Lost of responsiveness when 'product gallery' has more than 1 image
In a flex layout, however, I can see no problem as long as both blocks have a width. Very simple example without any frills: template-woo-single-product-2024-05-02.json - Google Drive
Best regards,
timmse
Hey!
Thanks for the quick reply, it seems like I was almost there but not quite. The flex example seems to work perfect, thanks! I think I had only given one of the two columns a width which still caused issues. Now it’s working fine!
Ok, great! I’ll add this report to the existing task and close it 