# Poor CSS / HTML element naming on user profile page

**URL:** https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330
**Category:** Development
**Created:** [October 31, 2019, 3:36pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330 "2019-10-31T15:36:26Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![Lumi](https://avatars.discourse-cdn.com/v4/letter/l/b38774/32.png) [@Lumi](https://meta.discourse.org/u/Lumi)
#### Post date: [October 31, 2019, 3:36pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/1 "2019-10-31T15:36:26Z")

</div>

If a profile background image is set, it is incorrectly shown above the profile details on user profile page. This behavior was introduced in  
[https://github.com/discourse/discourse/commit/814aee343be3e3d36199ba0a6bc1c13f34121687#diff-627a1051c75254f2996005eaa90bd13d](https://github.com/discourse/discourse/commit/814aee343be3e3d36199ba0a6bc1c13f34121687#diff-627a1051c75254f2996005eaa90bd13d)  
where the background image was moved to its own div. I think this was an unexpected side effect, but if it is intentional, you might want to rename it a profile header image or something in the user profile settings.

---

<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: [October 31, 2019, 3:39pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/2 "2019-10-31T15:39:48Z")

</div>

Can you provide a screenshot of this problem please?

---

<div class="post-metadata">

### Author: ![Lumi](https://avatars.discourse-cdn.com/v4/letter/l/b38774/32.png) [@Lumi](https://meta.discourse.org/u/Lumi)
#### Post date: [October 31, 2019, 3:45pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/3 "2019-10-31T15:45:42Z")

</div>

Here you go:

 ![profile_layout](https://global.discourse-cdn.com/meta/original/3X/1/5/150beda89671366d58ae2d6fa0192cdd72fa8712.png)

---

<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: [October 31, 2019, 4:16pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/4 "2019-10-31T16:16:59Z")

</div>

@awesomerobot did you want to confirm this?

---

<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: [October 31, 2019, 4:23pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/5 "2019-10-31T16:23:11Z")

</div>

Sure we can rename it to header instead of background. The overlay effect we used previously made profiles slightly harder to read and the overlay was dark to the point where most of the image was obstructed anyway (if you’re wondering why the change happened).

---

<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: [October 31, 2019, 5:23pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/6 "2019-10-31T17:23:23Z")

</div>

Renamed to header here (commit message has it backwards 🤦‍♂️)

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

---

<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: [July 16, 2023, 7:34pm UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/7 "2023-07-16T19:34:24Z")

</div>



---

<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 17, 2023, 6:14am UTC](https://meta.discourse.org/t/poor-css-html-element-naming-on-user-profile-page/132330/8 "2023-07-17T06:14:56Z")

</div>