Public Ticket #1421318
Single product lay-out not correct on mobile


  • Obsidiaan started the conversation

    This issue regards the single product lay-out on mobile or when we resize the webbrowser to a mobile width.

    Looking on a computer the images gallery and price information block are shown beside each other  6/6 width (12 colums width total). It looks ok√©.

    But in mobile view the pictures and the description are shown in very small columns. The price information underneath the pictures.  Leaving a blank space to the right for both columns.   

    I would excpect the columns would be like 6/6  or 12/12 width.
    So images would fill the screen on top. Then showing the price info with button full width underneath.

    Could you please provide us with a fix for this? It seems this part of the theme does not provide the correct mobiel view. 

    Kind regards

    Attached files:  Schermafbeelding 2018-01-05 om 10.14.10.png
      Schermafbeelding 2018-01-05 om 10.26.02.png

  •  788
    Theme replied


    please add the following code to Admin > Customize > Additional CSS field:

    @media screen and (max-width: 800px) {
    .woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images, .woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {width:100%;}

    Thank you

    Best regards,

    themeenergy support

  • Obsidiaan replied

    That is smooth, fast an great.  Thank you very much. the solution works like a charm.

    Kind regards. 

  •  788
    Theme replied

    We are glad to be of service.

    Have a great day!

    Best regards,

    themeenergy support