Tabellen innerhalb DIV positionieren

[GerdB51]

Hallo,
ich möchte inerhalb eines DIV-Elements 3 kleine Tabellen positonieren. Das funktioniert auch, solange die Tabellen ungefähr die gleiche Größe haben. Wenn jedoch eine Tabelle länger ist, steht der folgende Text nicht mehr unterhalb der DIV-Begrenzung, sondern wird in den DIV-Bereich an die kürzeste Tabelle angrenzend "geschoben". Was mach ich verkehrt?
Der Code:
<p>........</p>
<div style="width: 100%;">
<table style="float: left; width: 28%">
<tr>
<td style="width: 60%;">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
<tr>
<td style="width: 60%">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
</table>
<table style="float:right; width: 31%; margin-right:12px">
<tr>
<td style="width: 60%;">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
<tr>
<td style="width: 60%;">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
</table>
<table style="width: 28%; margin-left: 34%">
<tr>
<td style="width: 60%;">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
<tr>
<td style="width: 60%;">&nbsp;</td>
<td style="width: 40%">&nbsp;</td>
</tr>
</table>
</div>
<p class="right"><a href="#start">nach oben</a></p>
<p>&nbsp;</p>
<p class="gelb12fett">&nbsp;Name</p>
<p>........</p>

Vielleicht hilft die Originaldatei weiter (das Projekt wurde noch nicht offiziell ins Netz gestellt-
Z. B. http://www.hsvfan-oberpfalz.de/5biog/biog-ba.php, die zugehörige CSS-Datei ist
http://www.hsvfan-oberpfalz.de/assets/design-grund.css.

Danke für jede Hilfe.
Gerd

 

[MrMurphy]

Hallo

Was mach ich verkehrt?

Abgesehen von der Unhöflichkeit die Schrift in deinem Beitrag hier zu verkleinern?

Du mißbrauchst float zum Layouten. Float ist ausschließlich dafür gedacht Text andere Container, zum Beispiel Bilder, umfließen zu lassen.

Für dein Vorhaben ist Flexbox ( display: flex; ) gedacht.

Gruss

MrMurphy

 

[GerdB51]

Sorry MrMurphy, wolte nicht unhöflich sein, habe den Text verkleinert, da er etwa lang war.
Danke für den Tipp, mit Flexbox habe ich mich noch nicht befasst. Ich hatte das mit "float" in irgendeinem Internetkurs gesehen. Ich habe jetzt auch meine Homepage damit aufgebaut. 3 Bereiche (Steuerung 1, Steuerung 2 und Inhalt) und diesen mit "float" ihren Platz zugewiesen.Ist das auch verkehrt. denn da funktiomiert es.?
Gruss
Gerd

 

[MrMurphy]

Hallo

Webseiten können unbegrenzt groß werden. Schriften zu verkleinern ist deshalb überhaupt nicht notwendig.

in irgendeinem Internetkurs gesehen

Die Entwicklung geht halt weiter. In Urzeiten wurde mit Frames layoutet. Danach wurden Tabellen zum Layout mißbraucht. Danach lange Float. Das war zu seiner Zeit jeweils nicht anders machbar, weil es keine besseren oder gar korrekte Lösungen gab. Alle diese Notlösungen haben aber für sich viele Nachteile.

Ist das auch verkehrt. denn da funktiomiert es.?

Nur weil etwas funktioniert heißt es noch lange nicht dass es (immer noch) auch sachlich korrekt ist.

Inzwischen wurde Flexbox speziell zum Erstellen von Layouts eingeführt und wird schon lange hinreichend unterstützt.

Von daher sollte Float nur noch für seinen eigentlichen Daseinszweck eingesetzt werden und genau wie Tabellen nicht mehr zum Layouten mißbraucht werden.

Gruss

MrMurphy