ResolvedResponsive Logo

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #26244
    blubbbiz
    Participant

    Hi

    can you please help me so i can place the responsive logo on 100% of the width? im not so good into css and i dont want do try hours till i find it 🙂

    hopefully you can help me out, the link is https://www.leosfastfood.ch also it would be nice to have it bigger on the desktop version, where can i change this? there is space between the menus in my case.

    thanks for help

    #26250
    Althemist
    Keymaster

    Hi blubbbiz,

    I am afraid the logo can’t be made 100% wide. It’s the special header layout that prevents that. It can’t be increased neither on desktop, nor on mobile. The recommended size of the image is a rectangle or square with max dimensions 170x110px.

    I’d suggest making your logo as bigger as possible inside a file with the above dimensions. In your specific case, I guess you’ll get best results if you make the logo two lines – e.g.:

     LEOS
    fastfood
    #26251
    blubbbiz
    Participant

    lol you tell me i should change the logo of the customer because in your eyes its not possible to do it? which file is responsible for the mobile css? so i can try myself then as i cannot believe this. all other things are below and i dont see why it cannot be the whole width

    #26283
    Althemist
    Keymaster

    You can add mobile-specific CSS anywhere. Doesn’t need to be in a specific file. The best place to make customization changes would be in the style.css of the child theme.

    What I am saying is that because of the specific header layout it’s risky to change the original flow, as it may lead to other unpredictable problems on other devices. I am not telling you to change the customer logo, just giving you options to fit in the logo layout and size restrictions.

    If you need help with that, just let us know, but please note that it is highly not recommended to change the original layout. There are many elements in the header that might be affected in different usage scenarios.

    Regards,
    Dimitar

    #26295
    blubbbiz
    Participant

    yes i need to change it. on desktop its ok like this now but mobile i just dont get it “centered”

    please help me to get it in the middle so i can move on to the other customisations

    thank you very much

    #26309
    Althemist
    Keymaster

    @media only screen and (max-width: 768px) {
    #header.lafka-has-header-top #logo {
    width: 100%;
    left: auto;
    margin-left: -20px;
    }
    #header #logo img {
    max-width: none;
    max-height: none;
    text-align: center;
    margin: 0 auto;
    }
    }

    Just keep in mind this would only work if NO mobile logo is assigned AND you’re doing it on your own responsibility, as it may really cause other issues on different devices.

    Also, for the logo not centered problem, please note that your original image is not centered. There is an empty gap on the right side.

    Hope this helps.

    Regards,
    Dimitar

    #26317
    blubbbiz
    Participant

    niiiiice that worked like a charm! thank you very much 🙂

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in and have valid license to reply to this topic.

License required for the following item
Login and Registration Log in · Register