nicht angemeldet
Tabellen springen nicht ganz zur nächsten Zeile
Hi,
ich versuche seit Stunden einige Tabellen nebeneinander darzustellen und am Fensterrand normal umbrechen zu lassen.
mit dem
.xxxx { float:left }
funktionert es halbwegs. Das Problem ist, dass die Tabellen beim Umbruch nicht gänzlich in die nächste Zeile springen, sondern nur unter das nächslinksliegende Objekt.... schwer zu erklären daher hier der Code:
---------------------------------------
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.x { float:left }
</style>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<table class="x" width="1"><tr><td>
<img src="test.jpg" width="117" height="150" >
viel text viel text viel text viel text viel
text viel text viel text viel text viel text
viel text viel text xt viel text viel text
viel text viel text viel text viel text viel
text viel text viel text viel text
</td></tr></table>
<table class="x" width="1"><tr><td>
<img src="test.jpg" width="117" height="150" >
viel text viel text viel text viel text viel
</td></tr></table>
<table class="x" width="1"><tr><td>
<img src="test.jpg" width="117" height="150" >
viel text viel text viel text viel text viel
text viel text viel text viel text viel text
viel text viel text xt viel text viel text
viel text viel text viel text viel text viel
text viel text viel text viel text
</td></tr></table>
</body>
</html>
-----------------------------------------
Ich könnte es lösen indem ich alle Tabellen gleich hoch mache, aber die Höhe hängt von der Fontgröße ab und daher möchte ich sie flexibel lassen.
Ich bin für jede Hilfe dankbar.
Gruss, Stolat
-
Gibt es da keine Lösung? Oder ist die Frage ZU einfach? Ich hab vom html nicht viel Ahnung.
-
Hallo Stolat,
ich denke es wäre am besten, wenn du <div> container verwendest ... eigentlich brauchst du keine Tabellen.
.x {
width:170px;
float:left;
margin:10px;
}<div class="x"> INHALT </div>
Zu dem Problem mit dem 'unters Objekt rutschen' zwei Fragen:
1.) Schreibst du das alles mit der Hand oder kommen die Inhalte dynamisch und werden in Templates eingefügt?
2.) ist es wichtig, wieviele Kästchen in einer Zeile sind?... vielleicht hast du ja einen Link für uns oder kannst uns beschreiben, was du im Endeffekt erreichen bzw. darstellen möchtest.
Schönen Abend
anschinsan-
Hi Anschinsan
ich experimentiere auch garade mit div-containern aber das Problem besteht weiter.
zu 1
ich schreibe alles mit der Handzu 2
die Anzahl der Kästchen in einer Zeile soll von der Fensterbreite abhängen. Also, so viele wie gerade möglich.Wenn du den von mir geposteten Code einfach im Browser ausführst und dann das Fenster schmaler machst, sieht Du sofort was ich meine. Ich möchte, dass das dritte Kästchen unter das erste springt und nicht unter das zweite ;-)
Gruss,
Stolat-
Hallo Stolat,
wenn du so variabel bleiben möchtest ist dein Problem nicht lösbar - einfach weil du nicht weißt, wie hoch der erste Container ist.
Wenn der erste länger als der zweite und dritte ist, wird der dritte immer in der nächsten Zeile unter dem zweiten landen.
Lösungsansätze sind eine feste Breite des Layouts oder manuelle Umbrüche mit clear:both ... damit verlierst du aber die Flexibilität.
Schöne Grüße
Anschinsan-
Hallo Stolat,
wenn du so variabel bleiben möchtest ist dein Problem nicht lösbar - einfach weil du nicht weißt, wie hoch der erste Container ist.
Wenn der erste länger als der zweite und dritte ist, wird der dritte immer in der nächsten Zeile unter dem zweiten landen.
Lösungsansätze sind eine feste Breite des Layouts oder manuelle Umbrüche mit clear:both ... damit verlierst du aber die Flexibilität.
Schöne Grüße
AnschinsanHi Anschinsan
danke für die Antwort
was kann ich tun, damit nicht die obere Kante der Elemente auf einer Linie ist sondern die untere? Also wie bei normalen Buchstaben? Ich glaube das ist das Problem hier.
Gruss
Stolat-
Yerf!
was kann ich tun, damit nicht die obere Kante der Elemente auf einer Linie ist sondern die untere? Also wie bei normalen Buchstaben? Ich glaube das ist das Problem hier.
Das Problem ist, dass du eigentlich display:inline-block statt float willst. Allerdings ist die Brpwserunterstürtzung noch nicht wirklich super. Opera kanns, IE lässt sich evtl. mit display:inline überreden und FF kann glaub ich diplay:-moz-inline-block. Evtl. lässt sich da etwas über CSS-Hacks zusammenbauen.
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
-
-
-
-