# 通知菜单存在轻微错位

**URL:** https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757
**Category:** UX
**Created:** [2018年五月30日 16:58 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757 "2018-05-30T16:58:25Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![Pad\_Pors](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pad_pors/32/52016_2.png) [@Pad\_Pors](https://meta.discourse.org/u/Pad_Pors)
#### Post date: [2018年五月30日 16:58 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/1 "2018-05-30T16:58:26Z")

</div>

not very important one and just about the beauty: username icon seems to be upper than the right row; of course if it’s not intentional.

 ![Untitled](https://global.discourse-cdn.com/meta/original/3X/4/c/4c7fc6ed66e5a0fca41cbebe5e1c69d2c478cbb7.png)

---

<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: [2018年五月30日 17:03 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/2 "2018-05-30T17:03:10Z")

</div>

Which OS/Browser are you seeing this in?

---

<div class="post-metadata">

### Author: ![itsbhanusharma](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/itsbhanusharma/32/180717_2.png) [@itsbhanusharma](https://meta.discourse.org/u/itsbhanusharma)
#### Post date: [2018年五月30日 17:13 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/3 "2018-05-30T17:13:58Z")

</div>

I have a slightly different issue actually, the three icons (bookmarks/messages/settings) are slightly off center to the left.

---

<div class="post-metadata">

### Author: ![gerhard](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gerhard/32/119479_2.png) [@gerhard](https://meta.discourse.org/u/gerhard)
#### Post date: [2018年五月30日 21:22 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/4 "2018-05-30T21:22:12Z")

</div>

I’ve seen that in Firefox on Linux. There should be an old topic about it somewhere, but I can’t find it right now.

---

<div class="post-metadata">

### Author: ![Pad\_Pors](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pad_pors/32/52016_2.png) [@Pad\_Pors](https://meta.discourse.org/u/Pad_Pors)
#### Post date: [2018年五月31日 06:26 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/6 "2018-05-31T06:26:05Z")

</div>

on latest firefox on windows.

---

<div class="post-metadata">

### Author: ![Cameron\_D](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cameron_d/32/97535_2.png) [@Cameron\_D](https://meta.discourse.org/u/Cameron_D)
#### Post date: [2018年五月31日 07:01 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/7 "2018-05-31T07:01:43Z")

</div>

Misaligned on Firefox mobile too

---

<div class="post-metadata">

### Author: ![Mittineague](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mittineague/32/114259_2.png) [@Mittineague](https://meta.discourse.org/u/Mittineague)
#### Post date: [2018年五月31日 17:24 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/8 "2018-05-31T17:24:19Z")

</div>

It’s this CSS

```plaintext
div.menu-links-header a {
    padding: 0.5em;
}

```

Changing it to

```plaintext
div.menu-links-header a {
    padding: 0 0.5em;
}

```

seems to fix it for me, though I haven’t thoroughly tested for side-effects. And it might be better to use

```plaintext
div.menu-links-header a {
    padding: 0.5em 0.5em 0;
}

```

---

<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: [2018年六月19日 19:44 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/9 "2018-06-19T19:44:43Z")

</div>

Pushed a fix for this that improves the icon alignment using flexbox, the change should be available on the tests-passed branch later today.

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

---

<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: [2018年六月20日 22:00 UTC](https://meta.discourse.org/t/very-slight-misalignment-in-the-notification-menu/88757/10 "2018-06-20T22:00:02Z")

</div>

This topic was automatically closed after 26 hours. New replies are no longer allowed.