Archiv-Modus von Basti1012 Lösungspage

Hallo zusammen, ich möchte gerne eine HTML Seite aufbauen, die aus 3 Tabellenzeilen besteht Die x-Werte stehen normal, Z soll um 90 Grad nach rechts gedreht dargestellt werden. Meine bisherigen Versuche klappen insofern, dass die Ausrichtung der Texte klappt, nur leider die Positionierung nicht. Mein gedrehter Text steht außerhalb der Tabelle (ganz am rechten Rand). Daher habe ich 2 Fragen: 1. Woran liegt es, dass der Text außerhalb der Tabelle steht? 2. Funktioniert das auch, wenn ich den o. g. Tabellenblock nach rechts und unten mehrmals kopiere? Hier einmal mein HTML-Code bzw. CSS-Datei im Anhang. Test ist ohne Drehung und T ist mit Drehung. Wäre super, wenn mir jemand von Euch hier kurz die Lösung nennen könnte.

Code

                                    
                                <style>
  
p{
  text-align:center;
  margin:0;
}
table{
    margin:0 auto;
  width:90%;
  border:1px solid black;
}
td{
  width:30%;
  padding:10px;
  height:56px;
  border:1px solid black;
}



td:nth-child(2){
width:100px;
}

.gross{
  font-size:30px;
}
.quer>p{
  font-size:20px;
  line-height:0.95;
}
  
  </style>
<body>
<p>heiner xxxx datenbank 3.0</p>
<p>bla blub  Beschriftung</p>
<p>Stand:
16.12.2018 13:08:16</p>
<table>
<tr>
   <td colspan="2">Anzeige</td>
  <td class="quer" rowspan="3">
  <p>A</p>
  <p>r</p>
    <p>t</p>
    <p>i</p>
    <p>k</p>
    <p>e</p>
    <p>l</p>
    <p>n</p>
    <p>r</p>
  </td>
  </tr>
  <tr>
  <td>Baureihe</td>
<td  class="gross">4AKDEPN*jgghbe+</td>
</tr>
<tr>
  <td colspan="2">Kurzname</td>
</tr>
</table>
</body>

basti1012.bplaced.net

Tabelle mit 90 Grad gedrehten Text anzeigen

Code