Problems with mobile responsiveness

  • Resolved pbwpwork

    (@pbwpwork)


    5 years, 6 months ago

    Hi,

    I am having a problem using siteorgin to design a page that is truly mobile responsive. I have produced two versions of the same page to highlight my point. I have hoping somebody is just able to point out something that I have missed.

    Version 1: https://verumsolutions.cloudaccess.host/work-health-and-safety-management-systems/

    Created: Using just a single row with a text wrap round the top left image
    Pros: Looks great on a PC and Ipad
    Cons: Mobile – text is squeezed up on the right of the image and looks very bad (is not resizing the image)

    Version 2: https://verumsolutions.cloudaccess.host/test/
    Created: Using two rows, first row – image (col 1) text (col2), second row – text (1 col only)
    Pros: Looks great on a mobile (it splits the image and text on two separate rows)
    Cons: on a PC and Ipad, it put a big gap between the rows that looks very odd.

    How can I get the best of both worlds? Probably something really obvious, but a bit stumped. Is there a setting to reduce the gap between rows? I have tried to give some negative padding on the top of the second row (to push it up) with no effect.

    Thanks

    Paul

    • This topic was modified 5 years, 6 months ago by pbwpwork.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Support Andrew Misplon

    (@misplon)

    Hi Paul

    Thanks for reaching out.

    In the first layout, your theme handles the alignment of images and whether or not to clear those alignments on mobile. If you replicate the first layout in the Classic Editor without Page Builder, you should find the same result. You could remove the theme’s image alignment and center for mobile resolutions using Custom CSS. That’s unfortunately, beyond our free support scope.

    In the second layout, you could edit the first row and open the Layout section on the right. Try setting the Row Bottom Margin to 0.

    Hope that helps.

Viewing 1 replies (of 1 total)
  • The topic ‘Problems with mobile responsiveness’ is closed to new replies.