Support » Theme: Responsive » Header language buttons displaced on smaller screens

  • Resolved Ailsa Craig

    (@ailsa-craig)


    The responsive theme is working perfectly except for the two language buttons on top. As soon as I go below 800px they go below the logo and throw the navigation down a bit. I reckon the logo is responsible..and my css! Anyone know how I can keep those buttons on top?
    This is the website:
    http://www.sciencehooks.scoilnet.ie/
    Any help much appreciated.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Emil Uzelac

    (@emiluzelac)

    Hi,

    Very nice looking site, I really like what you guys came up with 🙂

    All right, so the reason why the links are not in the same position is because .top-widget is set to -100px on desktop and that doesn’t apply while on mobile devices.

    This should fix that:

    /* =Responsive (Mobile) Design
    -------------------------------------------------------------- */
    @media screen and (max-width: 980px) {
    
        .top-widget,
        .home .top-widget {
            margin-top: -100px !important;
        }
    
    }

    or just

    /* =Responsive (Mobile) Design
    -------------------------------------------------------------- */
    @media screen and (max-width: 980px) {
    
        .top-widget,
        .home .top-widget {
            margin-top: -100px;
        }
    
    }

    Thanks,
    Emil

    Ailsa Craig

    (@ailsa-craig)

    Hi Emil,
    Thanks so much – that works a treat!

    Emil Uzelac

    (@emiluzelac)

    Fantastic!

    Thanks,
    Emil

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Header language buttons displaced on smaller screens’ is closed to new replies.