# How to finely scroll out custom header?
**URL:** https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869
**Category:** UX
**Created:** [November 12, 2018, 6:26pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869 "2018-11-12T18:26:31Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [November 12, 2018, 6:26pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/1 "2018-11-12T18:26:31Z")
I see the top header of [discourse.ubuntu.com](http://discourse.ubuntu.com) and when I scroll down, the extra header smoothly scrolls out.
[https://global.discourse-cdn.com/meta/original/3X/8/c/8c95bebd52112fa7ed8ab89b5d0985aaef9cec1c.mov](https://global.discourse-cdn.com/meta/original/3X/8/c/8c95bebd52112fa7ed8ab89b5d0985aaef9cec1c.mov)
Unlike other discourse forums like: [https://talk.turtlerockstudios.com](https://talk.turtlerockstudios.com) Notice the glitchy behaviour of the top nav. bar
[https://global.discourse-cdn.com/meta/original/3X/a/1/a116e82ff909b76cae90cec6fab4c14a2f931921.mov](https://global.discourse-cdn.com/meta/original/3X/a/1/a116e82ff909b76cae90cec6fab4c14a2f931921.mov)
Can you provide the HTML and CSS code for the Ubuntu’s forum? with smooth transitioning
---
### Author:  [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [November 12, 2018, 6:35pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/2 "2018-11-12T18:35:58Z")
It’s not a like-for-like comparison.
The big difference between those pages is that the TRS page is /latest while ubuntu uses /categories. Latest scrolls infinitely, categories is limited to 20 posts. There will always be a bit of jerkiness when your browser polls the server for more posts.
If you need something from the source you can look directly at the pages, but I’m pretty confident that rather than having some super-secret smooth scrolling code in their pages the reason is the above.
Please don’t tag people directly, particularly when a small amount of research on your part can answer these questions.
---
### Author:  [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [November 12, 2018, 6:56pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/3 "2018-11-12T18:56:16Z")
> [@Stephen](#):
>
> The big difference between those pages is that the TRS page is /latest while ubuntu uses /categories. Latest scrolls infinitely
I just switched ubuntu to /latest and reloaded the page. No glitch seen.
But TRS still shows glitch. It’s surely some code.
I will update this thread when I get it working.
> [@Stephen](#):
>
> Please don’t tag people directly, particularly when a small amount of research on your part can answer these questions
Sure 🙂
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [November 12, 2018, 7:23pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/4 "2018-11-12T19:23:43Z")
Why don’t use the appropriate theme component?
> [@Brand Header](https://meta.discourse.org/t/brand-header-theme-component/77977):
>
> discourse2Summary Brand Header adds an extra top header for branding with your logo, navigation links, and social icons for both mobile and desktop views. Brand logo can be an image or text.eyeglassesPreview [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/brand-header)hammer_and_wrenchRepository Link [https://github.com/discourse/discourse-brand-header](https://github.com/discourse/discourse-brand-header)open_bookNew to Discourse Themes? [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Features Desktop preview: …
You can customize it in another stylesheet, in case.
You can try this one too, where links are inside the header
> [@Custom Header Links](https://meta.discourse.org/t/custom-header-links/90588):
>
> discourse2Summary Custom Header Links allows you to easily add custom text-based links to the header.eyeglassesPreview [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/custom-header-links)hammer_and_wrenchRepository Link [GitHub - discourse/discourse-custom-header-links · GitHub](https://github.com/discourse/discourse-custom-header-links)open_bookNew to Discourse Themes? [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Features Desktop Mobile (due to very limited space, adding more than one link on mo…
---
### Author:  [@Johani](https://meta.discourse.org/u/Johani)
#### Post date: [November 13, 2018, 7:00am UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/7 "2018-11-13T07:00:00Z")
This occurs because the header is docked at the top of `#main-outlet` while positioned absolutely and then it changes to `position: fixed` and so it “jumps” to the top of the page once you scroll past the top of `#main-outlet`.
This is not an issue if you don’t have custom markup added before the main-outlet, but if you do, you get the results you described.
I pushed a small fix to address the issue and the transition will now be like what you see on the Ubuntu community if you add custom markup
[https://github.com/discourse/discourse/commit/ac7b05884917c8949ad9690d1e3b63eeb7f6303f](https://github.com/discourse/discourse/commit/ac7b05884917c8949ad9690d1e3b63eeb7f6303f)
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [November 13, 2018, 7:06am UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/8 "2018-11-13T07:06:52Z")
Awesome find and fix! Thanks for bringing this up @rootsh3ll!
---
### Author:  [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [November 13, 2018, 7:21am UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/9 "2018-11-13T07:21:59Z")
Awesome Johani.
The kind of support Discourse staff gives is unbeatable! It always amazes me how responsive people are here on meta staff.
Thanks a lot man. Will be testing it soon 🙂
---
### Author:  [@Jennifer\_Abrams](https://meta.discourse.org/u/Jennifer_Abrams)
#### Post date: [August 31, 2019, 1:20pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/17 "2019-08-31T13:20:35Z")
So is this supposed to be fixed no matter what your CSS is like?
Otherwise what should I delete, because I am having the same issue as OP (using the latest discourse). How do I know what markup is before #main-outlet? You mean before it line-wise in the file?
Thank you!
---
### Author:  [@Jennifer\_Abrams](https://meta.discourse.org/u/Jennifer_Abrams)
#### Post date: [August 31, 2019, 1:21pm UTC](https://meta.discourse.org/t/how-to-finely-scroll-out-custom-header/101869/18 "2019-08-31T13:21:31Z")
did you get it fixed?