Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 10, 2020 at 9:00 pm #1221413
    burgola

    Dear Kriesi.
    I am using this demo:

    Home

    Is there any way to reduce (slim) black area with logo and burger menu icon in mobile mode (i.e. 360×640)?

    While resizing browser width I have noticed that somethimes below logo and a burger menu icon appears additional (full width) dark area. Is this a bug or how do I remove it?

    June 10, 2020 at 9:18 pm #1221417
    Nikko

    Hey burgola,

    Can you give us a screenshot showing the additional dark area? I could not seem to see it on my end.

    Best regards,
    Nikko

    June 10, 2020 at 9:37 pm #1221421
    burgola

    on the left you can see additional dark gray area, in the middle logo is not in the middle, and on the right everything is fine (but i want to reduce black area height).

    June 11, 2020 at 1:22 pm #1221668
    Rikard

    Hi,

    Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
.home .avia-builder-el-0 .slideshow_caption {
    padding-top: 0;
}
}

    Best regards,
    Rikard

    June 11, 2020 at 6:27 pm #1221861
    burgola

    Rikard thanks, there is no more additional area, logo is always centered in black area.
    The main question remains: how to slim black main header height for 20%.
    I found solution below in forum, but in a mobile mode (360×640) logo is positioned outside black area.

    #header {
    height: 40px;
    }

    .container.av-logo-container, .container.av-logo-container a, .container.av-logo-container a img {
    height: 40px !important;
    line-height: 40px !important;
    max-height: 40px !important;
    }

    June 12, 2020 at 10:00 pm #1222192
    Nikko

    Hi burgola,

    Can you try to replace this code:

    #header {
height: 40px;
}

    to:

    .responsive #top #wrap_all #header {
    height: 40px !important;
}

    Then add this as well:

    .responsive #top .logo {
    display: block !important;
}

    And make sure to wrap them inside the media query, just like what Rikard posted.

    Best regards,
    Nikko

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