Avada Forums Community Forum Sticky Header Height

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • Cooning
    Participant
    Post count: 3

    Hey Ho lovely community,

    I have a rather trivial question. Is there any way to adjust the height of the sticky header via Custom CSS for the Avada theme?

    Many thanks in advance 🙂

    Chris

    pigsandbees
    Participant
    Post count: 29

    Changes the height to 80px:

    .fusion-header {
    height:80px;
    }

    Cooning
    Participant
    Post count: 3

    Thanks! Works fine! 🙂

    mahasvin
    Participant
    Post count: 6

    Did not worked in 5.7.2 Avada Child Theme. Caching issue of child theme CSS. Workaround was to explicitly load child theme style.css to browser then it was acknowledged.

    rubincain
    Participant
    Post count: 2

    This does not appear to be a valid solution to me

    The sticky header inherits the main menu height which looks odd. Is there a hidden option to control the sticky header height or does it need to use css, in which case what is the CSS for 5.7.2?

    freshinktechcoop
    Participant
    Post count: 10

    Mashasa- did you reset the fusion cache in the theme settings? Also if you code in the customizer you can see all changes live and it makes writing CSS a lot easier.

    Rubincain- Trhere isn’t but seems like it’s something a lot of people would want. It would also be nice to have an option on mobile sticky to only bring the menu sandwich down instead of the whole logo. Click submit an idea on the right side an I will too!

    You will need to use CSS to adjust the padding to center, is that the issue you are running into?

    rubincain
    Participant
    Post count: 2

    The sticky header ends up looking like this if you have a 160px ish square logo as the standard header logo

    http://energizemyvision.com/stickyheader.png

    mahasvin
    Participant
    Post count: 6

    @freshinktechcoop – This was hosting-side cache issue in the end. But to go that far, you might want to disable Fusion Options caching first. Since your hosting might not provide caching out of the box, as SiteGround did in my case. And with theme caching on, that’ll be the same bump.

    mahasvin
    Participant
    Post count: 6

    @rubincain – I have this sorted with:

    .fusion-header {
    top:16px;
    height:92px;
    }
    .fusion-header-sticky-height {
       height:92px; 
    }

    in child theme style.css and switched off caching everywhere (beforee production, turn it on on prod site)

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