rustdoc: Declaration truncated on small mobile screens

[jsha]

To reproduce, open Chrome devtools, turn on the device toolbar (Ctrl + Shift + M). I believe this defaults to "Moto G4" (360x640). If not, select Moto G4. Then visit, e.g. https://doc.rust-lang.org/nightly/std/io/trait.Read.html.

---

---

The stable version of the same page looks fine:

---

---

[torhovland]

@rustbot claim

[torhovland]

Using flex on h1, now it's like this on narrow screens:

[jsha]

#84376 is a definite improvement, thanks @torhovland! I'm curious: why fix this by wrapping the trait name and the out-of-band items (version, -, src)? It seems like the problem is not that out-of-band is pushed onto the next line, but the out-of-band interferes with the sizing of the declaration.

Generally it seems better for the trait name to use as much of a line as it can, even at the cost of pushing the out-of-band items to the next line.

[torhovland]

I'm curious: why fix this by wrapping the trait name and the out-of-band items (version, -, src)? It seems like the problem is not that out-of-band is pushed onto the next line, but the out-of-band interferes with the sizing of the declaration.

Hmm, I didn't wrap anything or otherwise change the HTML structure. I've just introduced flex here so that (particularly with the addition of #84451) it works the same way as the method declarations further down on the page.

You can of course argue that it might be better if the out-of-band items were pushed to the next line, but I feel that justifies its own issue.

[torhovland]

Having said that, it looks easy enough to do. Check out the example at https://jsfiddle.net/uyoLdx6m/2/

I can update #84451 with that if you like.

[jsha]

I didn't wrap anything or otherwise change the HTML structure.

Ah, I meant "adding flex so the trait name can line-wrap."

I also hadn't realized that we were already using flex on the method declarations. I agree: if we want to change that it should be its own issue, and in the meantime, good to be consistent and use flex here.