# Close button misalignments on banners

**URL:** https://meta.discourse.org/t/close-button-misalignments-on-banners/150762
**Category:** UX
**Created:** [May 7, 2020, 9:57pm UTC](https://meta.discourse.org/t/close-button-misalignments-on-banners/150762 "2020-05-07T21:57:56Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![Steven](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/steven/32/187890_2.png) [@Steven](https://meta.discourse.org/u/Steven)
#### Post date: [May 7, 2020, 9:57pm UTC](https://meta.discourse.org/t/close-button-misalignments-on-banners/150762/1 "2020-05-07T21:57:57Z")

</div>

This is a very minor issue and easy to fix on a forum, but just in case, I wanted to share with staff.

There is a small misalignment between the close button on the notification banner and the banner topic, as you can see in this example.

 ![image](https://global.discourse-cdn.com/meta/original/3X/d/5/d589da68ae7b104a229a38e1f467d396570b0702.png)

I fixed it with a setting to `10px` on this css class, but maybe you’ll go another route

> <https://github.com/discourse/discourse/blob/902d0e1e3a61bc2d2d05c617a6e8e51aaaf42b30/app/assets/stylesheets/common/base/alert.scss#L11>

Like I said, it’s a very minor issue 😬

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [May 7, 2020, 10:02pm UTC](https://meta.discourse.org/t/close-button-misalignments-on-banners/150762/2 "2020-05-07T22:02:19Z")

</div>

ooo yeah that’s a good one cc @awesomerobot

---

<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: [May 8, 2020, 2:59am UTC](https://meta.discourse.org/t/close-button-misalignments-on-banners/150762/4 "2020-05-08T02:59:53Z")

</div>

I made some updates to improve this:

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

 ![Screen Shot 2020-05-07 at 10.59.18 PM](https://global.discourse-cdn.com/meta/original/3X/7/e/7e3b28043db4fc9da92dfa3c1206d886d9532276.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: [May 9, 2020, 10:00pm UTC](https://meta.discourse.org/t/close-button-misalignments-on-banners/150762/5 "2020-05-09T22:00:05Z")

</div>

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