Header Content hide when scroll

[lorchme]

I have some copy in the header under the logo that I want to hide or not display when scrolling. I have found CSS code to change the opacity on scroll, but then the logo is still sitting in the same position and isnt alined with the menu items that are on its right, and there is more space below the logo than above. looks not right.

Is there a way to have to logo shift down when this scrolls? Or do I need to build this some other way to achieve what I want?

[ruenel]

Hello @lorchme,

Thanks for writing in!

I have logged in and checked your site. To get this resolve and move down the logo as soon as you scroll the page, you will need to add this custom css:

.x-bar-fixed .x-image {
    margin-top: 2em;
}

We would love to know if this has worked for you. Kindly check your site now.

[lorchme]

Thanks,
That worked.

[christopher]

You’re welcome.