# 徽章仍未正确对齐

**URL:** <https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779>\
**Category:** UX\
**Created:** [2019年一月6日 00:32 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779 "2019-01-06T00:32:14Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月6日 00:32 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/1 "2019-01-06T00:32:15Z")

</div>

Continuing the discussion from [Badges not aligned correctly](https://meta.discourse.org/t/badges-not-aligned-correctly/103988):  
After I checked if our forum was updated, I looked and found that the badges are still jumbled up and some texts are in weird locations.

 ![59%20AM](https://global.discourse-cdn.com/meta/original/3X/9/4/9442040f99d07b11f040d85d4cf18ffc60643c35.png)  
Such as this example, the more badges are in a confusing location and the badges are still mixed up. I see this only in safari version Version 12.0.2 (13606.3.4.1.4) and only in our forum.

---

<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:** [2019年一月7日 15:33 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/3 "2019-01-07T15:33:50Z")

</div>

Are these the badges on the user profile page? I’m having a hard time reproducing the broken layout.

 ![55%20AM](https://global.discourse-cdn.com/meta/original/3X/e/1/e1a4b453015fabf971091c4b994d556181b9f226.jpeg)

---

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月8日 05:11 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/4 "2019-01-08T05:11:08Z")

</div>

It’s both the [user profile](https://discourse.codecombat.com/u/Chaboi_3000/badges) and the [badges page](https://discourse.codecombat.com/badges)

---

<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:** [2019年一月8日 16:34 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/5 "2019-01-08T16:34:43Z")

</div>

I’ve tried a couple different Macs and iPads and I still can’t reproduce the issue on Codecombat — could you clear your cache or check the page in an incognito window? I wonder if you’re seeing the old CSS before it was fixed?

---

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月8日 23:32 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/6 "2019-01-08T23:32:32Z")

</div>

Cleared cache, discourse updated and tried in incognito. Still see the weird layout.

---

<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:** [2019年一月9日 01:09 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/7 "2019-01-09T01:09:55Z")

</div>

Try reducing your browsers font size setting.

---

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月9日 04:22 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/8 "2019-01-09T04:22:58Z")

</div>

Ok, tried several sizes and none are working.

---

<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:** [2019年一月9日 04:24 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/9 "2019-01-09T04:24:13Z")

</div>

Do you have a custom per-user theme enabled on your forum? Try in anonymous / incognito browser mode as well. You can also enable Discourse [safe mode](https://meta.discourse.org/t/53504?silent=true) without any harm at all.

---

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月9日 04:26 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/10 "2019-01-09T04:26:14Z")

</div>

No, it’s the default theme. I also tried incognito as stated a few posts above. Do you mind telling me what [safe mode](https://meta.discourse.org/t/53504?silent=true) is?

---

<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:** [2019年一月9日 04:26 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/11 "2019-01-09T04:26:24Z")

</div>

You can search for it very easily. Also @awesomerobot did you test at all widths?

---

<div class="post-metadata">

**Author:** ![Chaboi\_3000](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chaboi_3000/32/163015_2.png) [@Chaboi\_3000](https://meta.discourse.org/u/Chaboi_3000)\
**Post date:** [2019年一月9日 04:27 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/12 "2019-01-09T04:27:30Z")

</div>

Oh thanks. I tried, and still I see the weird layout. Also got the repo steps.  
Resize the window’s width to something like this, and it’ll be the normal layout.

 ![04%20PM](https://global.discourse-cdn.com/meta/original/3X/4/7/471e327962833aa7b0821a17961ebb88babc35fe.png)  
But enlarging the width causes this.  
 ![13%20PM](https://global.discourse-cdn.com/meta/original/3X/9/8/98e689edfc30981f42b1847de78173477a22b419.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:** [2019年一月11日 17:52 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/13 "2019-01-11T17:52:50Z")

</div>

I can’t repro by changing the width, but I did finally by adjusting my browser’s zoom level a bit.

I’ve pushed a change that should fix the problem.

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

---

<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:** [2019年一月25日 23:00 UTC](https://meta.discourse.org/t/badges-still-not-aligned-correctly/105779/14 "2019-01-25T23:00:08Z")

</div>

This topic was automatically closed after 14 days. New replies are no longer allowed.
