UPDATING ISSUES ON MOBILE VIEW

  • Unknown's avatar
    sarahwebgcas · Member ·

    Hello! I am looking to solve three issues on the mobile view on my site. Any help is greatly appreciated!

    GCAS College Dublin – The Global Centre for Advanced Studies

    The first is the double search bars – there is a red and grey visible and I would just like the red one to show.

    The second issue is the social icons – I would like them to be more aligned with the site title – but only on the mobile version, and not the desktop version.

    The third is the extra white space at the top of the site.

    Thank you in advance!

    The blog I need help with is: (visible only to logged in users)

  • supernovia · Staff ·

    Hey there! Thanks for your patience on this. I can’t quite tell what’s causing the odd issues with extra spacing on mobile. That isn’t happening on the SkatePark demo, so I wonder if it’s something extra Elementor added.

    Regardless, I think this adding this to your Additional CSS will do the trick, and I’ve added the mobile-only margin you requested as well:

    @media (max-width: 782px) { /* just on smaller screens */
 /* collapse spacers in container 11 */
   .wp-container-11.wp-container-11 .wp-block-spacer {
    display: none;
    }
 /* match margins for social icons menu */
   ul.wp-block-social-links.alignleft.has-small-icon-size.has-icon-color.is-style-logos-only.is-content-justification-left.is-layout-flex.wp-container-4.wp-block-social-links-is-layout-flex {
    margin-left: 2.25em;
  }
}

    Please confirm whether that does the trick; it did in my testing.

    If it does, there’s one mystery left: I see the grey search icon in some cases and not in others. Unfortunately, I can’t access it in the tools I’m using for troubleshooting.

    But it seems to be coming from Elementor. Since your theme already has a built-in search, can you check Elementor’s settings, then deactivate that option?

  • The topic ‘UPDATING ISSUES ON MOBILE VIEW’ is closed to new replies.