Mobile view (gap between bullet lists

  • Author
    Posts
  • #163945

    tommy1090
    Member
    Original poster

    Hi,

    I have a page on my website with two bullet point lists of 19 points each (they sit beside each other, in two columns side by side). This looks fine when viewing on the computer.

    In mobile mode the two lists are combined into one long vertical list (rather than siting beside each other in two separate columns). This leads to a gap halfway down the list.

    Is there CSS or any other way to get rid of this gap in mobile view?

    Thanks,

    Tommy

    The blog I need help with is: smartclinicalpsychology.com.au

    #163964

    itsdavidmorgan
    Theme Author

    Hi Tommy,

    Sure! Just add the following CSS in the Customizer:

    .wp-block-column ul {
        margin: 0;
    }

    I hope this helps.

    Thanks!

    #163974

    tommy1090
    Member
    Original poster

    Thanks David, that worked. I’ve also noticed, when viewing the homepage on a mobile phone, that if I click the share to mail button (which I have beside the share buttons for fbk, whatsapp and linkedin) that the dropdown box (with send to email address/your name etc) opens to the right, and when the “i’m not a robot” box is clicked, the photos open to the left and cannot be seen completely. Is there any code to make this open so it fits to the mobile screen?

    Thanks for your help,

    Tommy

    #163990

    itsdavidmorgan
    Theme Author

    Hi Tommy,

    Try the following code:

    #sharing_email {
      left: 40px !important;
    }

    Thanks!

    #163995

    tommy1090
    Member
    Original poster

    Thanks David, that worked too :)

The topic ‘Mobile view (gap between bullet lists’ is closed to new replies.