Products Page rendering on mobile devices

  • Since WooCommerce V3 I have noted that Product Page rendering on a mobile device is not very good. The rendering on a mobile phone was in two columns, but now there is a large amount of white space between the two columns which mushes the products display a bit. Also, when you go to the product itself, the Basket button is being displayed half the size.
    Going to Appearance>Customise and selecting a mobile phone screen displays the product fine, but when you actually look at it on a mobile phone, it is putting the white space in-between. The issue exists on Firefox, Chrome and Safari for iOS.

    • This topic was modified 7 years, 6 months ago by radiusbenders.
Viewing 3 replies - 1 through 3 (of 3 total)

  • Please post the url for your site.

    Thread Starter radiusbenders

    (@radiusbenders)

    I’ve worked this back, and the issue is to do with css optimisation for site speed. If I turn off cs optimisation, then the page will load correctly on on a mobile device. I guess I’ll need to figure out the css required for mobile devices so that it is loaded with the page.

    The site is:
    letterboxman.com.au

    Yes, if I turn off auto-optimise with ?ao_noptimize=1 the page renders properly on mobile. Turning off AO helps with the product page also. So the css is fine, its the cached css that is causing the problems. You’ll need to remove all the old AO cached stylesheets. AO should remake them.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Products Page rendering on mobile devices’ is closed to new replies.