Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • July 21, 2021 at 12:46 pm #1311122
    Monika

    Hello,

    as you can see in the link below, i want my logo to be centered and the bar should be transparent on the left and right side.
    I want it to be sticky and stay transparent.

    What should I do?

    Cheers
    Monika

    July 22, 2021 at 9:50 am #1311399
    Rikard

    Hey Monika,

    You can set the header to be transparent in the Layout menu on the page in question, and you can set the header to be sticky under Enfold->Header->Header Behaviour.

    Please use this CSS to center the logo:

    div .logo {
    float: none;
    position: inherit;
    left: auto;
    z-index: 1;
    display: table;
    margin: 0 auto;
}

    Best regards,
    Rikard

    July 30, 2021 at 12:28 pm #1313438
    Monika

    Thank you very much.
    Sadly its not exactly what I was looking for.
    When I scroll down, and the bar gets smaller, the bar still have some white in it. It is not completely transparent.
    And the Burger goes down unter the bar when I Scoll down.

    Do you have an Idea how I can fix this?

    August 4, 2021 at 5:15 am #1314246
    Ismael

    Hi,

    Thank you for the update.

    You can use the following css code to make the header fully transparent even on scroll. The css code will also remove the bottom border.

    .header_color .header_bg, .header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu a {
    background-color: transparent;
}

#header_main {
    border: 0;
}

    Best regards,
    Ismael

    August 8, 2021 at 8:53 pm #1315147
    Monika

    Thank you.
    Sadly there is still some white in the bar when I scoll down.
    Do you have an other Idea?

    August 9, 2021 at 5:00 am #1315199
    Ismael

    Hi,

    Did you toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css code? Please post the login details in the private field so that we could check the modification.

    Best regards,
    Ismael

    August 9, 2021 at 9:13 pm #1315898
    Monika

    Hi Ismael,

    thank you.
    the CSS compression is deactivated and still it does not work, the bar has some white in it.

    Plese check my private message with the login.

    cheers
    monika

    August 9, 2021 at 9:29 pm #1315900
    Monika

    i send you the wrong passwort. its in the private section again

    August 13, 2021 at 7:28 am #1316552
    Ismael

    Hi,

    Thank you for the update.

    We managed to login to the site using the account above, but it does not have administration rights, so we cannot access the theme options. Please adjust the user role and make sure that the Appearance > Editor panel is accessible.

    Best regards,
    Ismael

    August 13, 2021 at 9:53 am #1316575
    Monika

    I changed it to administration rights.

    Thanks! It almost works now.
    Theres just one thing that does not work with this logo bar: On mobile, the logo is not centered, and not transparent.
    (because the black line on the left side should start at the beginning of the side and not under the logo bar.

    Is this possible?

    If not: then it would look better when the logo is on the left side in mobile version. Then the black line will start directly under it. that would be also ok.

    Cheers
    Monika

    August 17, 2021 at 4:32 am #1317032
    Ismael

    Hi,

    Sorry for the delay. You can use this css code to remove the left margin of the logo and move it to the edge of the screen.

    @media only screen and (max-width: 767px) {
    .responsive #top .logo {
        margin-left: 0;
    }
}

    Best regards,
    Ismael

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