6

While looking at a recent question, I noticed the 'Related' box on the right side looked rather odd:

enter image description here

The actual questions seem fine:

So I think it's just the 'Related' box at the right.

Any idea what's wrong? It seems to be related to the furigana script; the problem goes away if I disable JavaScript. It happens in both Firefox and Chrome.

2
  • I was initially mystified why SE did this, but I think they might've done it to allow more content to be displayed on sites that use MathJax, e.g. math.stackexchange.com/questions/1564768/… (although even there it renders strangely for me on FF/Ubuntu) - I could hack around this in the Furigana engine, but I think it'd be cleaner if this was fixed in the CSS of this site itself.
    – cypher
    Commented Apr 22, 2016 at 21:42
  • Related issue on Mathematics.se meta: meta.math.stackexchange.com/questions/23073/…
    – cypher
    Commented Apr 22, 2016 at 22:13

2 Answers 2

0

The CSS has been updated by SE, so the Furigana/Japanese font elements should be rendering properly now.

Further details are at Titles with MathJax break in the related questions.

2

I was waiting for someone to post something about this :)

It seems to be due to .spacer > a.question-hyperlink being styled with display: flex - if you replace that style with display: inline, the problem goes away.

The solutions appear to be:

  1. Remove flex from that element, and change it back to inline (I think that's what those hyperlinks were previously set to?)

  2. Disable Japanese font override span tags (i.e. the <span lang="ja"> tags inside the hyperlinks, which are added by the Furigana engine to make sure Japanese uses the right fonts).

  3. Make the entire hyperlink render in a Japanese font, not just Japanese text, and don't add <span lang="ja"> tags.

Any of these three should solve this problem, but the second two would still have issues if titles with Furigana are in the hyperlinks, which would mean I would need to disable/put in brackets Furigana in hyperlinks if I did this.

As a result, the first option looks the most attractive to me.

2
  • Some titles do seem to render properly, but only if all of their Japanese characters are connected to ASCII characters without spaces.
    – Sjiveru
    Commented Apr 23, 2016 at 23:47
  • @Sjiveru I don't know the full mechanics of display: flex, I only heard of this property yesterday, but I don't think that's true from my testing. flex renders differently for me when there's no more room on a line (example screenshot: i.sstatic.net/dcTcc.png). It also looks like whitespace in-between element nodes/text nodes is ignored, similar to the way it often is for block-styled elements, which might be what you're seeing.
    – cypher
    Commented Apr 24, 2016 at 10:13

You must log in to answer this question.