Selbst wachsende Tabellen in HTML

[eigThy]

Moin moin,
ich bin dabei für meinen Dad eine Homepage zu Weihnachten zu basteln, und bin auf ein Prob gestoßen. Habe das Forum schon durchsucht und nichts passendes gefunden.
Also Stand der Dinge: http://www.ak2010.eu/hartmut/index.html

Die linke untere Box soll als Content dienen und sollte somit je nach Inhalt selbstständig mitwachsen.

Problem 1: Die rechte Box in der das Gedicht steht soll, wenn der Content wächst, automatisch auch mitwachsen.

Problem 2: In der linken Box liegt am unteren "Rand" die Kreisgrafik, beim wachsen der Box soll nur der obere Teil ohne Grafik wachsen, aber der untere Teil mit der Grafik im Text mitgenutzt werden. Also wenn der Text zu lang werden würde soll nur der obere Teil wachsen, der Text aber über die ganze Box verteilt sein. Hoffe ihr versteht was ich meine

Wäre sehr froh über eure Hilfe.

 

[Sven Mintel]

Moin,

Irgendwie entdecke ich dort nicht folgende von dir beschriebene Dinge:

1. linke untere Box
2. Content
3. die Kreisgrafik
4. obere Teil ohne Grafik

;-]

 

[StupidBoy]

Ich hoffe ich hab dich richtig verstanden, also hier mal eine Tabellen-Layout das das umsetzt, was ich verstanden habe:

<table width="1000" border="0" cellpadding="0" cellspacing="0" style="border:1px solid black;">
  <tr>
    <td height="265" colspan="2">Der Head-Bereich findet sich hier</td>
  </tr>
  <tr>
    <td width="546" style="background:url(http://www.ak2010.eu/hartmut/Bilder/Unbenannt-2_07.jpg) bottom left no-repeat;">
Ein wenig Content... 
</td>
    <td width="438" style="background:#ff0000;">
    	Etwas Literatur...   
    </td>
  </tr>
    <tr>
    <td height="20" colspan="2">Impressum etc.</td>
  </tr>
</table>

Als kleine Erklärung: Die Tabelle besteht nur noch aus vier Zellen, den Kopfbereich der die große obere Grafik und das Menü enthalten würde, dieser erstreckt sich über 2 Spalten, darunter befinden sich besagte spalten. Da beide Zellen in der gleichen Zeile stecken sind sie in der Höhe immer identisch.
Darunter befindet sich eine Zelle die sich über bei Spalten erstreckt für den Footer, also Impressum-Link etc.
Die "Kreis-Grafik" wird durch die CSS-Parameter bottom und left immer in der linken unteren Ecke der Zelle gehalten, no-repeat stellt sicher, dass die Grafik nicht gekachelt wird.

Um das Layout flexibel zu gestalten ist der Rahmen um selbiges nicht mehr eine Grafik, sondern mit border: 1px solid black im Table-Element definiert.

Tendenziell solltest du aber im Sinne des schönen Markups mit mehr CSS und weniger in sich verschachtelten Tabellen arbeiten, dass macht die Sache nur unnötig kompliziert.

Siehe dazu: http://www.css4you.de

PS: Den CSS-Code im Kopf der Datei oder in einer externen Datei zu bündeln wäre noch schöner, ich denkee aber, dass so der Zusammenhang zwischen CSS und HTML schneller zu überblicken ist.

PPS: Mitwachsen tun die Zellen da für diese keine Höhe definiert ist.

 

[eigThy]

Besten Dank für die schnelle Antwort.

Da es bis Weihnachten fertig werden soll, kann ich mich leider nicht mehr mit CSS usw. auseinandersetzen, aber denke mal ich setze mich danach mal einfach so ran.

Liebe Grüße und Danke