Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1092218

    Please read carefully!

    We did a support forum search first to see how we can add space to the top of our Logo in the header section. We found this code and it works for the home page:

    .logo {
    margin-top: 35px;
    }
    .header-scrolled .logo {
    margin-top: 35px;
    }

    Here is how the home page looks: https://imgur.com/sTsfjZd

    This is perfect for us, not sure if we used the correct custom style but it looks good.

    The issue is the sub pages are not pushing down the rest of the page with the new logo alignment:
    And here is how it looks on the Sub pages: https://imgur.com/K1imqDo

    Is there a better way to control the space around the logo? If I remove the custom code then the logo will be right up against the top of the browser.

    We already tried Enfold > Header > Header Size and that does not change anything accept the size of the logo. How do we control the padding / margins above the logo?

    Check private content for user login, you can do what you want.

    #1092327

    Hey Daniel,
    With the size of your logo, adding the margin to the to pushes the logo beyond the container. You don’t notice it on the homepage because of the transparency.
    It would be recommended to make the logo smaller so that with the margin it fits inside the container, or you could make the container height larger.
    We can assist with this, including making these changes activate only on your sub-pages, so that you have the large logo on the home page, and the smaller one on the sub-pages.
    Would you like this?

    Best regards,
    Mike

    #1092460

    Yes please

    #1092541

    Hi,
    I examined your page and found that the corrected logo would fit better for mobile devices and the other pages, so I wrote this css to show the margin-top only on the home page at screen sizes above 989px:

    @media only screen and (min-width: 989px) { 
    #top.home .av_header_transparency .logo {
        margin-top: 35px !important; 
    }
    }

    I have commented out your other css and added this already, Please clear your browser cache and check.

    Best regards,
    Mike

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