• Resolved Vero4ka

    (@vero4ka)


    Hi,

    I’m having some alignment issues with my top bar. Note: it works 100% correct in Firefox, not so in Chrome / IE. Here is the link to the image of what I’m getting when reducing the width of the browser window. Sorry – can’t provide link to the website as it’s being developed locally.

    I have 2 topbar widgets (social links; search) and I also have the following CSS added:

    .topbar-widget .virtue_social_widget {
    float:right;
    margin-left: 30px;
    }

    Again, it doesn’t happen in Firefox, just Chrome and IE. Any help on how to fix these alignment issues would be greatly appreciated!

Viewing 3 replies - 1 through 3 (of 3 total)
  • hannah

    (@hannahritner)

    Hey, so it’s just happening in mobile? Try putting your css in a media query:

    @media (min-width: 900px) {
    .topbar-widget .virtue_social_widget {
    float:right;
    margin-left: 30px;
    }

    Hope that helps!
    Hannah

    If your window size is smaller, then it could just be that your running out of space. the widget area is only 50% of the topbar. you can change that though with css:

    .kad-topbar-right {
    width: 100%;
    }

    Kadence Themes

    Thread Starter Vero4ka

    (@vero4ka)

    I haven’t even thought that it might be happening because I was running out of space! Kadence Themes – thank you so much, your code worked like a charm. I also added the following CSS:

    .form-search{
    width: 180px;
    }
    #topbar-search form{
    float: right;
    }

    And now it works perfectly in every browser!
    Thanks again 🙂

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Top bar alignment issues’ is closed to new replies.