# Mobile view editor cog dropdown issue

**URL:** https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215
**Category:** Bug
**Created:** [July 18, 2022, 8:05pm UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215 "2022-07-18T20:05:14Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![piffy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/piffy/32/254198_2.png) [@piffy](https://meta.discourse.org/u/piffy)
#### Post date: [July 18, 2022, 8:05pm UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/1 "2022-07-18T20:05:14Z")

</div>

# Version Installed:

 ![image](https://global.discourse-cdn.com/meta/original/4X/4/e/7/4e7051b546109b5db72c8ee41583af66f944b963.png)

> **[Commits · discourse/discourse](https://github.com/discourse/discourse/commits/80bda4a9db687b49437a760aeb3ad858a7da596b)**
>
> A platform for community discussion. Free, open, simple. - Commits · discourse/discourse

# Issue:

I entered [safe mode](https://meta.discourse.org/t/53504?silent=true) on mobile view. While replying to a post, the editor has the cog option at the end. When I tap it, the `d-editor-button-bar` becomes vertically scrollable instead of displaying a dropdown of the extra options.

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/1/e/c1ed11a341d4f7340057a3c672d754822ec31a5d.png)  
 ![image](https://global.discourse-cdn.com/meta/original/4X/4/5/4/454a0f04c0f928104fbd1563f80cda6af0fc32d3.png)

I’m assuming a dropdown box should appear? I’m getting this same issue on meta too.

---

<div class="post-metadata">

### Author: ![Benjamin\_D](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/benjamin_d/32/277831_2.png) [@Benjamin\_D](https://meta.discourse.org/u/Benjamin_D)
#### Post date: [July 18, 2022, 8:59pm UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/2 "2022-07-18T20:59:23Z")

</div>

edit: I can reproduce with chrome 103 on android on meta  
it’s probably fairly new, I don’t see it on 2.9.0.beta6 ( [09f1ef6b05](https://github.com/discourse/discourse/commits/09f1ef6b05a15b552ad022b43187c813d5ea3a90) )

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [July 18, 2022, 9:02pm UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/3 "2022-07-18T21:02:11Z")

</div>

I was just checking myself. 🙂 I can replicate on Android/Chrome:

 ![gear menu vertical scroll](https://global.discourse-cdn.com/meta/original/4X/6/9/2/69244710950dc39c8ab99d24f7627bbf3131fe00.jpeg)

 ![safe mode](https://global.discourse-cdn.com/meta/original/4X/e/4/2/e42c22b29ed2f31b85a861cc30b92bb9b00e2a8c.jpeg)

---

<div class="post-metadata">

### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)
#### Post date: [July 18, 2022, 9:24pm UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/4 "2022-07-18T21:24:06Z")

</div>

I can reproduce on desktop too with non staff account. On desktop it works for me with admin and moderator account.

On mobile it seems to the [safe mode](https://meta.discourse.org/t/53504?silent=true) not required to repro this issue.

---

<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: [July 19, 2022, 12:56am UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/5 "2022-07-19T00:56:45Z")

</div>

The menu is positioned differently on desktop (`position: fixed`) vs mobile (`position: absolute`) so because of 🧙 CSS magic ✨ the `overflow-x: auto;` on the `.d-editor-button-bar` container was hiding the menu on mobile but has no effect on desktop.

That `overflow-x: auto;` property fixes this issue on desktop:

![Screen Shot 2022-07-18 at 8.46.39 PM](https://global.discourse-cdn.com/meta/original/4X/5/d/7/5d77848dc8b246898514beed21b39dcd610a613e.png)

I just added a fix that shows the menu again on mobile by removing `overflow-x: auto;`

[https://github.com/discourse/discourse/commit/d8714facb605e1ec8fc5f2021b2551a0fce51e18](https://github.com/discourse/discourse/commit/d8714facb605e1ec8fc5f2021b2551a0fce51e18)

We’ll have to figure out if we can change positioning or do something else to solve the toolbar overflow issue on mobile.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [July 20, 2022, 11:09am UTC](https://meta.discourse.org/t/mobile-view-editor-cog-dropdown-issue/233215/6 "2022-07-20T11:09:17Z")

</div>


