Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • April 19, 2016 at 1:29 pm #617376
    richardwilding

    Dear Kriesi,

    How can I reduce the size of my website logo on smaller screen sizes?

    On mobile devices my logo is too large in relation to the other page elements.

    Also, on this website example below, a grey bar appears along the top of the screen on small screen sizes. It seems to be the page background colour I’ve set for my boxed layout and only appears on small screen sizes. How can I stop it from appearing?

    Thanks, Richard

    April 19, 2016 at 1:46 pm #617388
    Yigit

    Hi Richard!

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

    .responsive .logo img { max-height: 45%; top: 10px; }

    Best regards,
    Yigit

    April 19, 2016 at 2:01 pm #617402
    richardwilding

    Thanks Yigit,

    I tried this but it made the logo small even at full screen sizes?

    Best w, Richard

    April 19, 2016 at 2:05 pm #617406
    Yigit

    Hi!

    Can you please change the code to following one 

    @media only screen and (max-width: 580px) {
.responsive .logo img { max-height: 45%; top: 10px; }}

    Regards,
    Yigit

    April 19, 2016 at 3:14 pm #617454
    richardwilding

    That’s great, thanks Yigit

    Do you know how I can remove the grey bar that appears above the logo at small screen sizes?

    Also, how can I reduce the spring below the logo at small sizes? There is too much space below the logo when it is smaller.

    Best w, Richard

    April 19, 2016 at 3:35 pm #617466
    Yigit

    Hi!

    You have following codes

    .logo {
    margin-top: 24px;
}
#header {
    max-width: 100% !important;
    padding-bottom: 30px;
}

    Please change it to following 

    @media only screen and (min-width: 580px) {
.logo {
    margin-top: 24px;
}
#header {
    max-width: 100% !important;
    padding-bottom: 30px;
}}

    Regards,
    Yigit

    March 23, 2017 at 9:48 pm #765757
    supermario4

    Hi there! I’m having the same issue, my mobile logo view is super tiny when in vertical and only marginally larger in horizontal view. How do i set a different size for the mobile view?

    <arop

    March 24, 2017 at 4:22 am #765840
    Nikko

    Hi supermario4,

    Can you post a link to your site? so we can see how it looks and try to give you a solution.

    Best regards,
    Nikko

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.