Menu with overlaid site logo

I’m not sure if the title communicates what I’m trying to do, but the effect I’m going for is illustrated in this image:


I would like the site logo to have a greater height than the visible menu bar, and for the bar to be centered behind the site logo. Is such a thing possible in :foundry:?

I thought it might be possible centering the menu bar in a sticky content container, but I’m not quite sure how to get the logo displayed like that. Any pointers towards a solution would be appreciated.



did you try to give the logo a “custom” max-height with CSS, greater than the max-height of the nav-bar?

You can give the logo a css class in Stacks and address the logo very fine.

Thanks for the suggestion. I can change the size of the logo easily, but I think I need to play around with the alignment. The top of the logo is still aligned with the top of the nav bar. It’s a step in the right direction though.

The Navigation Bar is not designed to handle something like that. It would present problems.

Hmmm…well, I guess that’s the answer then. Thanks for letting me know.

I have to say that I made a little progress on this; but not enough.