# Username and timestamp at top of posts too high in latest Discourse

**URL:** https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643
**Category:** UX
**Created:** [2월 16, 2016, 12:15오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643 "2016-02-16T00:15:24Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 12:15오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/1 "2016-02-16T00:15:24Z")

</div>

In the latest version of Discourse, the username and timestamp is closer to the top border of posts than the avatar, making them misaligned. The read marker is as before and thus also misaligned.

The bottom buttons in posts are 15 px from the bottom border. Avatar is 15 px from the top border.

I can only imagine this being unintentional, and you’re probably already aware of it. Didn’t know what to search for, so I apologise if already reported.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 12:24오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/2 "2016-02-16T00:24:10Z")

</div>

I am a bit confused, can you attach some before and after screenshots?

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 12:29오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/3 "2016-02-16T00:29:25Z")

</div>

Hmm, do you know an unupdated Discourse forum? I’ll go look!

Compare with this:

 ![gQJVF4W](https://global.discourse-cdn.com/meta/original/4X/4/a/3/4a3e11b558ec86e4bb6c09bdbefb2a1a6019158e.png)

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 12:39오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/4 "2016-02-16T00:39:15Z")

</div>

This is 1.4.0.beta 7 … [http://forum.tycoonmarket.com/t/shades-of-what-you-say/18541](http://forum.tycoonmarket.com/t/shades-of-what-you-say/18541) looks just like it does here:

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

vs:

 ![](https://global.discourse-cdn.com/meta/original/3X/3/2/3210a85fba072224c116085ad3d1543fe7103948.png)

So not following what changed …

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 12:41오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/5 "2016-02-16T00:41:20Z")

</div>

Huh. Here’s how it looks for me, and apparently another person I spoke with.

- Firefox 44.0.2
- OS X 10.11.3 (15D21)

 ![](https://global.discourse-cdn.com/meta/original/3X/2/0/20a60eb592275b934c9634c46dcdfbe9e13a5b32.png)

It looks as it should in Safari!

Disabled all my Firefox extensions to see if any of them caused it, but they do not seem to have.

---

<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: [2월 16, 2016, 12:45오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/6 "2016-02-16T00:45:24Z")

</div>

I don’t know how many pixels, but with Firefox and Chrome it looks to be about a 0.5em difference between the top of the avatar and “name” and “time”.

Not all that noticeable to me, especially with round avatars, but it is there.

It looks to be the `.topic-body { padding: 5px 11px 2px; }` vs.  
`topic-avatar { padding: 15px; }`

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 12:49오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/7 "2016-02-16T00:49:38Z")

</div>

I think you are complaining about this by @rubo77 :

[https://github.com/discourse/discourse/pull/3954](https://github.com/discourse/discourse/pull/3954)

Which imo is just too hacky anyway… I don’t really agree with this change so going to revert it, it leads to the topic view not having a consistent view and I don’t think it is needed.

---

<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: [2월 16, 2016, 12:55오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/8 "2016-02-16T00:55:34Z")

</div>

If you wanted to save the 10px `.topic-avatar` could be given a “top” to match.

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 12:57오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/9 "2016-02-16T00:57:34Z")

</div>

Remember the read tracking marker and “Reply as linked topic” too if wishing to compact it. I’d probably remove the same amount of space for the buttons at the bottom of posts as well.

---

<div class="post-metadata">

### Author: ![rubo77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rubo77/32/41019_2.png) [@rubo77](https://meta.discourse.org/u/rubo77)
#### Post date: [2월 16, 2016, 1:09오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/10 "2016-02-16T01:09:30Z")

</div>

It should save as much height as possible on screens smaller than `max-height: 700px`

(sure you can simulate this on bigger screens with CTRL + to zoom)

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 1:12오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/11 "2016-02-16T01:12:13Z")

</div>

I follow the intentions here, but don’t feel like the support weight is worth it in this case. It is easily done in a site customization.

---

<div class="post-metadata">

### Author: ![rubo77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rubo77/32/41019_2.png) [@rubo77](https://meta.discourse.org/u/rubo77)
#### Post date: [2월 16, 2016, 1:13오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/12 "2016-02-16T01:13:21Z")

</div>

I still don’t see the problem. Where is some space missing or too much? can you show a screenshot please?

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 1:14오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/13 "2016-02-16T01:14:30Z")

</div>

**Compacted:**

- Username
- Timestamp

**Not compacted:**

- Avatar
- Read marker
- Reply as linked Topic

There’s a screenshot [in an earlier post](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/5).

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 1:16오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/14 "2016-02-16T01:16:45Z")

</div>

I just don’t see the value in a compacted view based on browser height… it just feels odd to me and a support burden. This was the only case where we changed behavior based on height, all other spots are based on width.

---

<div class="post-metadata">

### Author: ![rubo77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rubo77/32/41019_2.png) [@rubo77](https://meta.discourse.org/u/rubo77)
#### Post date: [2월 16, 2016, 1:18오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/15 "2016-02-16T01:18:53Z")

</div>

On small screens you are happy about every inch you save, so you can see some more posts at the same time on your screen (in a large good readeable font)

For example, I have an 11’’ screen on my laptop and I don’t want to scroll past all these white areas between every post

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 1:21오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/16 "2016-02-16T01:21:52Z")

</div>

I would probably not prefer the compact view even with everything properly aligned.

I use an 11″ 1366x768 display, and while I can understand the desire, I believe I disagree with having it by default.

---

<div class="post-metadata">

### Author: ![rubo77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rubo77/32/41019_2.png) [@rubo77](https://meta.discourse.org/u/rubo77)
#### Post date: [2월 16, 2016, 1:27오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/17 "2016-02-16T01:27:03Z")

</div>

so lets take it effect a bit later, lets say smaller than 600px

this will fix the “reply as lilnked” and the time position:

```
.topic-meta-data .post-info {
  margin-top: -2px;
}
.gutter .post-links {
    margin-top: -5px;
}

```

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 16, 2016, 1:30오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/18 "2016-02-16T01:30:01Z")

</div>

I just feel this is much better fitting as a site customization, you can make a topic for it here with screenshots and all. If there is strong drive from the community to include it in core we can revisit this in a few months.

As it stands it just feels a bit hacky and unfinished.

---

<div class="post-metadata">

### Author: ![rubo77](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rubo77/32/41019_2.png) [@rubo77](https://meta.discourse.org/u/rubo77)
#### Post date: [2월 16, 2016, 1:39오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/19 "2016-02-16T01:39:32Z")

</div>

Usually users wouldn’t see it anyway if they have normal large screens, higher than 600px. On small screens Discourse is really hard to use.

And as visitor you cannot change the view of discourses, that you visit somewhere in the web. So the default installation should reach all users with small screens.

Sure, I really like it like this with those two rules added. What are other opinions?

---

<div class="post-metadata">

### Author: ![jooize](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jooize/32/537063_2.png) [@jooize](https://meta.discourse.org/u/jooize)
#### Post date: [2월 16, 2016, 1:51오전 UTC](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643/20 "2016-02-16T01:51:15Z")

</div>

Does it trigger in small windows on large displays?

Please implement it well and take good screenshots as @sam suggested. Present the whole thing and it may find its way in. I’m not wholly against it, and I understand you want it in all Discourses you visit without having to do something extra for each one. Not to mention the feature may well make sense with the right implementation. I’m just not sure yet. Convince us!

[Next page](https://meta.discourse.org/t/username-and-timestamp-at-top-of-posts-too-high-in-latest-discourse/39643.md?page=2)
