Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 18, 2014 at 6:03 pm #225629
    AnaBasso

    Hello,

    I’m using non-fixed header with social icons. My logo is 436×79 px.

    I adapted its width using the code I found here at the forum:

    .logo, .logo a, .logo img { width: 436px!important; height: auto!important; max-width: 436px!important; padding-top: 5px;}

    I was able to adapt the width but got a problem:
    The main menu and the logo overlap for a while before it becomes fully responsive. I would like it to become responsive before.

    You can check the website here:
    http://www.congresinternacionaldetransit2014sct.cat/

    Thanks!

    • This topic was modified 10 years, 10 months ago by AnaBasso.
    February 18, 2014 at 8:16 pm #225703
    annettedaniel

    I have the same issue. Looking forward to response!

    February 19, 2014 at 12:37 am #225835
    Yigit

    Hey!

    Please see http://kriesi.at/documentation/enfold/change-when-mobile-menu-appears/

    Regards,
    Yigit

    February 20, 2014 at 7:06 pm #226967
    AnaBasso

    Hello Yigit,
    Thank you so much for the link! It worked very well.

    The only thing that is missing on my header right now is to make the logo smaller on mobiles (screens with 480 px wide and smaller).
    Right now the logo appears to be cut on the right side.
    Take a look:
    http://www.congresinternacionaldetransit2014sct.cat/

    Regards,
    Ana

    February 20, 2014 at 7:09 pm #226972
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    @media only screen and (max-width: 480px) { 
.responsive .logo img {
max-width: 100%!important;
}}

    Cheers!
    Yigit

    February 20, 2014 at 7:26 pm #226986
    AnaBasso

    That’s amazing, thank you!

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Header logo – adapted dimensions – responsive’ is closed to new replies.