Tim: Probleme mit Hoehe von Tabellenzeilen

Beitrag lesen

Hallo liebe SelfHTML-Gemeinde :-)

Ich bin gerade in der Mitte der Welt, Ecuador, für einen Auslandsaufenthalt von einem halben Jahr, und wollte hier jetzt eine Website über meine Erlebnisse etc. erstellen.
Für den Inhalt-Bereich habe ich mir etwas besonderes ausgedacht: ein Textfeld, umgeben von der Ecuador-Fahne. Leider gibt es keien Funktion, um ein Hintergrundbild zu strecken, also wollte ich einen Trick anwenden: 3 Tabellenzeilen, die jeweils die Höhe der Flaggenfarben haben, welche sind: Oben Gelb, 50%, darunter Blau, 25%, und unten Rot wieder mit 25%.
Das generelle Tabellenlayout, mit Zellen verbinden und allem, hat schon wunderbar geklappt und ist genau so wie ich es wollte, jedoch hört HTML bzw. CSS nicht auf meine Höhenangaben, es ignoriert sie einfach oder wendet sie nicht richtig an. Ich habe die Höhe auch nicht mit dem deprecated TD HEIGHT="50%", sondern schon mit CSS gemacht, aber es wird einfach nicht aktzeptiert.
Eine feste Größe der Zeilen will ich aber auch nicht, da meine Website für alle Bildschirmauflösungen funktionieren soll, und ich deswegen dehnbare Tabellen will.
Vielleicht könnt ihr euch ja mal den Quelltext angucken, und mir sagen, was ich falsch gemacht habe, würde mich echt sehr freuen!

Das nächste Problem, was ich schonmal schreibe, da das Internet hier verdammt langsam (56k Modem) und dazu auch nicht allzu billig ist, ist, dass das Textfeld sich bei viel Text nicht über die Seite ausdehnt, sondern das in dem Textfeld ein Scrollbalken kommt, so dass man nicht die ganze Seite nach unten scrollt, sonden nur das Textfeld. Dies hat aber erstmal geringere Priorität, erstmal sollte das andere funktionieren ;-)
Vielen Dank schonmal im Voraus, ich weiß ihr kriegt das hin!!!

<html><body>

<table border="1" style="width:100%; height:100%;">
  <tr>
    <td rowspan="2" style="height:50%; background-color:yellow;">
    1: 50%
    </td>
    <td style="background-color:yellow; height:10%;">
    2
    </td>
    <td rowspan="2" style="background-color:yellow;">
    3
    </td>
  </tr>
  <tr>
    <td rowspan="3" style="width:*; height:*; background-color:black;">
    <font color="white">Inhalt</font>
    </td>
  </tr>
  <tr>
    <td style="width:10%; height:25%; background-color:blue;">
    5: 25%
    </td>
    <td style="width:10%; background-color:blue;">
    6
    </td>
  </tr>
  <tr>
    <td rowspan="2" style="height:25%; background-color:red;">
    7: 25%
    </td>
    <td rowspan="2" style="background-color:red;">
    8
    </td>
  </tr>
  <tr>
  <td style="background-color:red; height:10%;">
  9
  </td>
  </tr>
</table>

</body></html>