Docs: Text in code snippets is tiny in Firefox

[rtorr]

Tested firefox 35/37

Left is chrome, right is firefox 35

[sedovsek]

Computed font-size of <code> element is:

• 12.8px in Chrome and
• 10.4px in Firefox.

It appears to me that Chrome somehow 'ignores' font-size of <code>'s first preceding element (<pre>), which has its font-size set to 13px, which would result in <code>'s computed font-size to be 10.4px, not 12.8px (resulting from 16*0.8).

[sedovsek]

It's rather odd… here's the video recording: http://recordit.co/0AYbaF6WCa
Although computed value is 13px, it has zero effect on typography of its child elements, unless you manually set the font-size to 13px.

I wish someone could explain this.

[zpao]

So Firefox is right and Chrome is wrong?

Feel free to fix (either way) with hacky CSS if you want!

[sedovsek]

@zpao That would be my guess, yes.
I'll take another look today, it was way past midnight last night, so I may have missed something. Either way, I'l like to get to the bottom of this issue and report a bug to Chrome if necessary.

[sedovsek]

@zpao, hey. PR is here: #2999
I found quite some interesting discrepancies on how browsers render <code>'s font-size. I wrote a short articles to summarise my findings.

[rtorr]

@sedovsek interesting. I had no idea this would be a rabbit hole of information. I had no time when I reported this to dig deeper. Good work!

[zpao]

PR is in, this will be all fine the next time we generate the website. Thanks again!

[sedovsek]

@zpao My pleasure. I have never learned so much from a trivial bug. 👍