# Select-kit oscurato dal corpo del post

**URL:** https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570
**Category:** Support
**Created:** [2 Ottobre 2018, 6:17pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570 "2018-10-02T18:17:42Z")
**Posts on this page:** 16
**Page:** 1

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [2 Ottobre 2018, 6:17pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/1 "2018-10-02T18:17:42Z")

</div>

Hi,  
I’ve been trying to fix an issue on an discourse instance I’m hosting ([https://community.revolutionarygamesstudio.com](https://community.revolutionarygamesstudio.com)) with the post category changer (the select-kit widget) being behind the post content. This is caused by my custom css and/or the theme (because another forum I’m hosting with the default theme doesn’t have this issue).  
Here’s a screenshot of the issue:

 ![Kuvakaappaus%20-%202018-10-02%2021-12-21](https://global.discourse-cdn.com/meta/original/3X/2/c/2c0190744c69e6eb2e3601ad2f9ea2ad1f6be086.jpeg)

I tried shoving `z-index: 300; position: absolute` just about to any css class that had select-kit in its name and I just could not make it appear correctly. The only somewhat working thing I found in dev tools was that by removing all the z-index styles from posts and avatars the dropdown showed up correctly, but those are discourse inbuilt ones and my theme doesn’t add extra z-index (it did at some point but I think I removed it) so I don’t want to do that.

If there are any css wizards here i’d appreciate help here as I’m out of things to try with my limited css knowledge.

---

<div class="post-metadata">

### Author: ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [2 Ottobre 2018, 6:31pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/2 "2018-10-02T18:31:43Z")

</div>

You probably are using a theme or some custom css, no reproduction on meta:

 ![02](https://global.discourse-cdn.com/meta/original/3X/a/2/a22d77855c37a97d013a7a7ba44063fc7240cf48.jpeg)

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [2 Ottobre 2018, 6:40pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/3 "2018-10-02T18:40:13Z")

</div>

I signed up on your site, @Boost, but I can’t see where I can trigger the screen you posted. Please describe how you got to that screen.

---

<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: [2 Ottobre 2018, 6:47pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/4 "2018-10-02T18:47:07Z")

</div>

Increasing the z-index on topic-title might do the trick, try

```CSS
#topic-title {
   z-index: 5;
}

```

---

<div class="post-metadata">

### Author: ![dax](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dax/32/244677_2.png) [@dax](https://meta.discourse.org/u/dax)
#### Post date: [2 Ottobre 2018, 7:01pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/5 "2018-10-02T19:01:24Z")

</div>

I signed up too, and the problem is more serious than expected using **Firefox**

 ![bug](https://global.discourse-cdn.com/meta/original/3X/2/a/2a29d8b1d887f4544595735d422053258a8449e6.gif)

with this JS error:

![image](https://global.discourse-cdn.com/meta/optimized/3X/a/9/a9e224747fab028851740e3e586db8969f22fff3_2_690x31.png)

(note that when the dev console is opened all start to work again)

Every time you try to add a category the page disappears and you need to do an hard refresh.  
In safe-mode everything works normally

---

<div class="post-metadata">

### Author: ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [2 Ottobre 2018, 7:05pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/6 "2018-10-02T19:05:22Z")

</div>

Also can’t reproduce on master, there’s however a warning that I will fix.

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [2 Ottobre 2018, 7:10pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/7 "2018-10-02T19:10:55Z")

</div>

I was using that as a solution before. But the “post admin actions” menu goes behind the title of the topic. So so far there’s been two possible choices: either the select-kit popups are behind the posts or the post admin menu is behind the title of the topic.

---

<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: [2 Ottobre 2018, 7:14pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/8 "2018-10-02T19:14:49Z")

</div>

Ah I see, that’s hard to do anything about because the title area and the posts are in two separate stacking contexts. Setting the post admin menu z-index higher/lower won’t do anything because the post’s parent container z-index is lower than the title’s.

By default we have `#topic-title` and `.topic-body` set to the same z-index. Not sure why the theme changed that.

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [2 Ottobre 2018, 7:15pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/9 "2018-10-02T19:15:18Z")

</div>

That seems to have only started today when I updated to [v2.2.0.beta2 +136](https://github.com/discourse/discourse/compare/f1bc1780a6c1ae812e4ec644a8e4851eff4b2489...tests-passed)…

---

<div class="post-metadata">

### Author: ![j.jaffeux](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/j.jaffeux/32/60297_2.png) [@j.jaffeux](https://meta.discourse.org/u/j.jaffeux)
#### Post date: [2 Ottobre 2018, 7:22pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/10 "2018-10-02T19:22:01Z")

</div>

Yes might be something with [FIX: don't send multiple requests when changing category notification… · discourse/discourse@1add11d · GitHub](https://github.com/discourse/discourse/commit/1add11d8c9765e60584b599996973e1f496ad5d0)

Will have a look tomorrow

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [2 Ottobre 2018, 7:22pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/11 "2018-10-02T19:22:32Z")

</div>

I tried doing that again with:

```plaintext
#topic-title{
    z-index: 3;
}

```

That should be the same index as the post. But still it appeared behind it.  
If I set the z-index to 4 on the topic-tittle then the select-kit popups are over the posts, but then once again the post admin menu is behind the title.

---

<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: [2 Ottobre 2018, 8:18pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/12 "2018-10-02T20:18:36Z")

</div>

Hmm… yeah that’s odd. I’m not seeing anything else obvious that could be causing it.

I wonder if the order that the CSS is being applied is causing an issue? If you completely remove those two `z-index` values added in the theme, does that change anything?

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [3 Ottobre 2018, 4:40pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/13 "2018-10-03T16:40:55Z")

</div>

When I don’t have any z-index on the topic title or the post set in the theme then it displays just like in my first screenshot. There are a few z-index things related to the background and top bar still in the theme but I hope they don’t mess with the stacking order related to this issue.

I would try updating the theme our theme is based on ([GitHub - discourse/discourse-vincent-theme: v0.77 · GitHub](https://github.com/hnb-ku/discourse-vincent-theme)) but as we have directly edited the css without playing around with theme components it’s going to take quite a bit of work to separate our customizations out of it.

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [3 Ottobre 2018, 5:02pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/14 "2018-10-03T17:02:58Z")

</div>

I think I may have identified what caused the issue with the theme:

```plaintext
/*#main-outlet > div.regular {
	display: flex;
	flex-direction: column;
}*/

```

When I commented out that everything seemed to be fine.

So I guess that that caused the topic title to be forced into a stacking context and then the children of it couldn’t escape from that context with any trick.

---

<div class="post-metadata">

### Author: ![Boost](https://avatars.discourse-cdn.com/v4/letter/b/8e8cbc/32.png) [@Boost](https://meta.discourse.org/u/Boost)
#### Post date: [11 Ottobre 2018, 4:19pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/15 "2018-10-11T16:19:23Z")

</div>

I just updated my discourse to version [v2.2.0.beta2 +310](https://github.com/discourse/discourse/compare/b54d94018272addf61b0473601730f3a8a8ef4b6...tests-passed) and there is still the issue that with firefox it is not possible to select the category for a new topic.

Should I create a bug report for this or is it already being taken care of?

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [10 Novembre 2018, 4:30pm UTC](https://meta.discourse.org/t/select-kit-obscured-by-post-body/98570/16 "2018-11-10T16:30:58Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
