How to make the logo wider without braking the layout

  • Resolved Stefan Nagy

    (@stefannagy)


    8 years, 6 months ago

    Hi,

    I took the snippet from here to make my logo wider: https://docs.woothemes.com/document/storefront-faq/

    When I adjust the logo width – let’s say I raise the percentage only one percent, from 21 to 22 – the logo, the search box and the secondary navigation don’t fit in one row anymore; the search box moves down.

    How can I make the logo wider without breaking the layout?

    Thanks

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter Stefan Nagy

    (@stefannagy)

    OK, I found a way to fix this by adjusting the width of the secondary navigation. Since I’m no developer and I don’t really know what I’m doing here it would be great if someone could tell me if I’m just lucky and there’s a much better solution for this. Thanks.

    @media screen and (min-width: 768px) {
    .site-header .site-branding, .site-header .site-logo-anchor, .site-header .site-logo-link, .site-header .custom-logo-link {
        width: 27%;
    }
    .woocommerce-active .site-header .secondary-navigation {
        width: 42%;
    }
}

    Hey,

    Nope, you’ve done it right! ??

    Cheers

    Thread Starter Stefan Nagy

    (@stefannagy)

    Thanks!!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to make the logo wider without braking the layout’ is closed to new replies.