How to remove sticky top bar?

the top bar including logo stays sticky whenever I scroll up and down the page.

Acutally I wanna make it sticky only when I scroll up and not sticky when scroll down the page.
if it’s not possible then I just wanna remove sticky feature.

1 Like

There is no setting to remove the sticky header – it’s a fundamental part of Discourse.


You could disable the stickiness by creating a theme and adding this to your CSS:

.d-header {
    position: relative;

This may impact the layout in other ways and cause issues with the dropdown menus, so you’d need to write some additional CSS to get around those problems. Getting started with themes: Structure of themes and theme components.

There are also a lot of additional topics that might help you with general Discourse questions in the #howto category.


Hi, I am curious what these issues might be? I turned off the position: fixed rule with the inspector to play around with this. I played around with the menus and everything seems to work fine.
I found the header height matters maybe when it comes to scrolling, but I am not sure yet what the implications are. topictimeline:
offset calculator:
I also tried to set position: relative, but then I have some empty space at the top of the page, but position: absolute seems to work fine.
PS: I know the sticky header is very important to you. I was okay with the sticky header before, but I am on a prolonged holiday in Taiwan and I have to use this tiny laptop screen all day. I will remove it in a theme component. I am sorry, but I have to do it. it makes me dizzy :smiley:


There might not be any related issues, but it’s not something we’ve seen many sites do, so it hasn’t been tested nearly as much as the default behavior.