Mobile Shop/Product Layout - by rhymeandreason

This topic has 4 replies, 3 voices, and was last updated 9 years ago ago by rhymeandreason

  • Avatar: rhymeandreason
    rhymeandreason
    Participant
    March 8, 2015 at 04:07

    Hello,

    I would like to display 2 products per row in the shop when viewing via mobile devices (rather than just one product per row). In an attempt to achieve this, I’ve added the following code to my custom css file:

    @media only screen and (max-width: 480px) { .products-grid .product {width: 50% !important; } }

    When the shop page is loading, it displays 2 products per row, as required. However, once the page finishes loading, the layout switches to display just one product per row (although each product still only occupies 50% of the row).

    Any idea what might be causing this issue?

    Please, contact administrator
    for this information.
    3 Answers
    Avatar: antcuc
    antcuc
    Participant
    March 8, 2015 at 09:55

    I would also very much like this feature. I think it’s important since mobile device displays are getting larger. It makes more sense to allow users to see more products at once if they can see the images well enough.

    Avatar: Eva
    Eva Kemp
    Support staff
    March 8, 2015 at 20:51

    Hello,

    As I see 2 products per row are shown on mobile device.
    https://s3.amazonaws.com/fvd-data/notes/168674/1425844073-hHAHAh/screen.jpeg

    Please check it once more.

    Thank you.
    Regards,
    Eva Kemp.

    Avatar: rhymeandreason
    rhymeandreason
    Participant
    March 8, 2015 at 23:44

    Hi Eva,

    If using a desktop browser adjusted to mobile width, it works fine. However, it appears the issue only occurs in Safari on an actual mobile device (it works fine in Chrome on mobile). Any ideas?
    null

  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.