Header bar got drunk on Firefox


#1

Since today on Firefox, when we scroll on a topic, the header bar has a weird alignment.

I’ve tried on Chrome to compare, and it works well.


(Jeff Atwood) #2

This is a topic for @neil


(Jeff Atwood) #3

I can also repro on Mobile Safari, but the alignment is different.


(Joe Buhlig) #4

FWIW On my end (mobile Safari) it seems the logo is crammed to the left.


(Rafael dos Santos Silva) #5

This happens on Chrome on Android too (Moto X 2014 - Android 6.0)


(Lars) #6

Yep, I got the same in Firefox, even here… It’s only when you’re scrolled a bit down inside a post…


(Sam Saffron) #7

I reverted the change for now @neil


(Sam Saffron) #8

Closing this as change was reverted


(Sam Saffron) #9

(Neil Lalonde) #10

(Neil Lalonde) #11

Hmm. Well I tried! All the browsers and devices I had looked fine. I did forget Firefox though. Even IE10 and IE11 were consistent with webkit browsers. Firefox is the new IE confirmed.

Both flexbox and display: table have proven to be fragile solutions. I’m the second person to take 5 attempts at this now, so who volunteers to be next? :stuck_out_tongue:


(Simon Cossar) #12

What is the problem that you are trying to solve?


(Jeff Atwood) #13

Vertical centering of the logo in the header, also working with text-only logos.


(Simon Cossar) #14

You can do it by setting the line-height on the <a> element that contains the logo to equal to the max-height of the logo. That should work for all cases except for when the logo max-height is changed in a customization.

<a class="logo-link" data-auto-route="true" href="/">
  <img id="site-logo" class="logo-big" src="https://discourse-meta.s3-us-west-1.amazonaws.com/original/3X/9/d/9d543e92b15b06924249654667a81441a55867eb.png" alt="Discourse Meta">
</a>
a.logo-link {
    line-height: 40px;
}

I’ve reduced the size of the logo here and but it stays centered.


(Tomas Ibarra) #15

I can’t repro this bug on my firefox broser, is the @Simon_Cossar solution the correct one?


(Sam Saffron) #16

Yeah, that is what I did :slight_smile:


(Sam Saffron) #17