# Horizon theme bug: Category heading container sticky in topic lists

**URL:** https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267
**Category:** UX
**Tags:** horizon-theme
**Created:** [31 באוקטובר,‏ 2025,‏ 1:04pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267 "2025-10-31T13:04:32Z")
**Posts on this page:** 15
**Page:** 1

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [31 באוקטובר,‏ 2025,‏ 1:04pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/1 "2025-10-31T13:04:32Z")

</div>

Hey guys

When I add an image, icon or emoji to a category, the category `category-heading` is sticky upon scrolling down and takes a lot of space.

![CleanShot 2025-10-31 at 14.03.16](https://global.discourse-cdn.com/meta/original/4X/a/e/a/aeab011cf0a87d568ad03b61c10eb3872ca342a5.gif)

Also affected is the category header theme component as the see my post below for reference.

> [@Discourse Category Headers theme component](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/184):
>
> I just tested the compatibility with horizon theme. all in all it’s basically working, but the only issue is that the plugin outlet currently used by the category headers theme component is inside list-controls container on Horizon theme. Hence the whole category header stays sticky.
> 
> Suggested solution is to change the plugin outlet or add an option to choose a different plugin outlet outside list-controls container, e.g. `discovery-list-controls-above` outlet.

tested on 3.6.0.beta2

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [31 באוקטובר,‏ 2025,‏ 6:41pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/2 "2025-10-31T18:41:06Z")

</div>

Yes, I agree that’s an annoying side-effect.

I don’t have a solution for it unfortunately. The category heading is in the same sticky element as the navigation, and I can’t move the sticky property a level down, because sticky doesn’t work within a flexed element…

I’d advise you to hide or minimise the logo with css on mobile.

---

<div class="post-metadata">

### Author: ![Aurora](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aurora/32/523140_2.png) [@Aurora](https://meta.discourse.org/u/Aurora)
#### Post date: [17 בדצמבר,‏ 2025,‏ 6:57pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/3 "2025-12-17T18:57:55Z")

</div>

The sticky navigation also bothers me. It takes up too much space.

How can I turn that off?

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [17 בדצמבר,‏ 2025,‏ 8:11pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/4 "2025-12-17T20:11:03Z")

</div>

There is no setting for it. You’ll have to overrule the CSS.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [26 במרץ,‏ 2026,‏ 3:42am UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/5 "2026-03-26T03:42:11Z")

</div>

The Horizon Theme has a neat feature, where the Category description remains visible while the Topic List is scrolled:

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/4/3/643fdbf9fe3dc8e1a25e74763fec52bbbdeb7ab3.png)

While this is lovely on desktop, when space gets tight (e.g. on mobile) this makes the Topic list quite difficult to read (especially if the text is quite extensive)

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/0/a/b0ad46af30a4ad4131d3b44d9072a47b98943053.jpeg)

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [26 במרץ,‏ 2026,‏ 9:23am UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/6 "2026-03-26T09:23:04Z")

</div>

This is an unintended side-effect of wanting to keep the _navigation_ visible actually. I’m not sure it can be fixed (both elements may be in the same container or something? :thinking: ) and if I have to choose, I’ll stick with my original intend.

If someone feels like taking a look, be my guest though.

---

<div class="post-metadata">

### Author: ![Aurora](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aurora/32/523140_2.png) [@Aurora](https://meta.discourse.org/u/Aurora)
#### Post date: [31 במרץ,‏ 2026,‏ 6:08pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/8 "2026-03-31T18:08:34Z")

</div>

I solved it with CSS.

```css
/* Disable Horizon sticky list-controls on mobile */
@media (max-width: 767px) {
  .list-controls {
    position: static !important;
    top: auto !important;
    transform: none !important;
    margin-top: 0 !important;
  }
}

```

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [1 באפריל,‏ 2026,‏ 2:34am UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/9 "2026-04-01T02:34:49Z")

</div>

Doesn’t that just ‘unstick’ both the description and the navigation on mobile?

We really want the description to disappear, while the navigation sticks.

---

<div class="post-metadata">

### Author: ![Aurora](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aurora/32/523140_2.png) [@Aurora](https://meta.discourse.org/u/Aurora)
#### Post date: [1 באפריל,‏ 2026,‏ 2:12pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/10 "2026-04-01T14:12:55Z")

</div>

The navigation also took up too much space.

At the moment, we’re considering using scrollable pills.

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/b/d/fbde3e4704f3ab2246869d41150fa531d1a340ba.jpeg)

I’d like to make them sticky, but I haven’t managed to get it working yet.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [1 באפריל,‏ 2026,‏ 6:01pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/11 "2026-04-01T18:01:25Z")

</div>

> [@nathank](#):
>
> We really want the description to disappear, while the navigation sticks.

Right, unfortunately there’s not a simple way to do this using CSS without also restructuring the layout.

The Horizon theme currently makes the entire `.list-controls` container sticky, which includes the category header. We can’t make the child `.navigation-container` sticky on its own, because sticky elements are stuck within their parent scrolling context.

We _could_ restructure this area, but it’s one of those changes that would impact all the themes that style using the existing structure… so there’s a good chance of regression for other themes and customizations, even if they don’t have a sticky nav like this.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [7 באפריל,‏ 2026,‏ 3:31am UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/12 "2026-04-07T03:31:14Z")

</div>

So what is the way forwards for this?

I do wonder if we should simply hide the category description on mobile for Horizon. It is kind of doubling up information anyway, in a space that is very tight.

I’ve achieved this with some simple CSS in the Mobile tab of a TC:

```plaintext
.category-heading.--has-logo {
    display: none;
}

```

Perhaps this should be included in Horizon?

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [7 באפריל,‏ 2026,‏ 11:40am UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/13 "2026-04-07T11:40:32Z")

</div>

> [@nathank](#):
>
> So what is the way forwards for this?

You just made the way forward: use custom CSS to tweak to your preferences :+1:

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [7 באפריל,‏ 2026,‏ 7:14pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/14 "2026-04-07T19:14:59Z")

</div>

Yeah, but in this case it is a wider issue with the Theme rather than just my preference. I find it hard to imagine someone who would actually _like_ a large sticky category description on mobile devices - I don’t think that was ever your intent with the design.

---

<div class="post-metadata">

### Author: ![chapoi](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chapoi/32/537252_2.png) [@chapoi](https://meta.discourse.org/u/chapoi)
#### Post date: [7 באפריל,‏ 2026,‏ 7:48pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/15 "2026-04-07T19:48:51Z")

</div>

It genuinely is unpredictable what people want in their community. I’m opting to leave it as-is, it’s easily hide-able if people choose to and that path is less confusing then “why doesn’t my category banner appear on mobile”.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [7 באפריל,‏ 2026,‏ 11:34pm UTC](https://meta.discourse.org/t/horizon-theme-bug-category-heading-container-sticky-in-topic-lists/387267/16 "2026-04-07T23:34:06Z")

</div>

What about hosting plans (i.e. the free plan) where admins cannot add custom CSS?

If some people genuinely want it (which I doubt), could there perhaps be a theme setting governing it?
