Frage zum Wiki-Artikel „rotate“

[nix]

Endlich mal eine richtige Frage — in der so manches drin steckt, was mich in der letzten Zeit so „an HTML“ geärgert hat. Zunächst:

body {
  display: grid;
  grid-template: "Ga Gb Gc" 1fr "Gd Ge Gf" 1fr "Gg Gh Gi" 1fr / repeat(3, 1fr);
}
header {
  grid-area: d;
}
…
  <header>Rand-Überschrift</header>

So weit, so gut. Nur: jetzt hätte ich header gerne um,mathematisch, 90 Grad (also -90deg) gedreht. Und passend in ihre Zelle (hier: grid-area: Gd;) eingepaßt. So, daß der Text eben „von Rechts her“ gelesen werden kann. Klar: rotate: -90deg;. Aber: wie ich es auch drehe und wende, ich kriege nicht raus, wie ich header erzähle, wie breit und hoch es auszufallen hat, damit das Ergebnis wenigstens so aussieht, als ob der Text in seiner Zelle sitzt. Abgesehen natürlich von dem Fall, daß ich das Layout von diesem Element abhängig mache und ihm dafür feste Werte vorgebe — was dann auch, nach ein wenig (vom Browser durchgeführter) Umrechnerei, doch wieder ein Pixel-Layout, gut, CSS-Pixel-Layout, wäre.

Aber sonst, ob nun mit Prozenten oder auch Versuchen mit Container-reletiven Maßen, wird aus diesem Header immer nur etwas, das irgendwo in einer unbestimmten Nähe vom gewählten Grid-Area herumlungert, drüber schwebt.