Hallo alle zusammen,
kann mir wer sagen, ob man floatende Elemente sauber verschachteln kann? Wenn ja, wie geht das genau?
Gruß
Thomas
Hallo Thomas!
kann mir wer sagen, ob man floatende Elemente sauber
verschachteln kann? Wenn ja, wie geht das genau?
Na ja. So ins Blaue hinein - ohne Vorlage, was Du bewirken willst - würde ich sagen… ich poste 'mal einen Code-Schnipsel. Ich hab’s mit Inline-CSS formatiert, damit man’s besser nachvollziehen kann:
--- schnipp ---
Dies ist der Text zum Bild...
© by Thomas...
Überschrift
Hier normaler Fließtext... bitte
auffüllen, um den Effekt zu sehen...
--- schnapp ---
Zwar ist das Beispiel nicht gerade Suchmaschinen-freundlich (weil der Bildkasten vor der Hauptüberschrift kommt), aber es sollte einwandfrei funktionieren:
Es wird ein Kasten (id=bildkasten) definiert, der rechts oben erscheint. Er hat einen inneren Abstand (padding) von 10 Pixel rundherum, nimmt ein Bild auf (das bei den gemachten Größenangaben zentriert darin erscheinen müsste), darunter findet sich ein Text zum Bild (links), auf den wiederum eine Copyright-Angabe mit etwas Abstand (0.5em) folgt. (Der Abstand sollte aber in dem Block, der floated angegeben werden.)
Nach Schließen des DIVs „bildkasten“ folgen dann die Textinhalte: Überschrift und Fließtext. Der Text sollte - bitte Fülltext verwenden - unter dem Bildkasten weiterfließen.
Das Beispiel funktioniert auf FF 2.0.x einwandfrei, auf IE 6.0 wird die Copyright-Angabe aber unter den „Text zum Bild“ gesetzt. Siehe: http://dannyfox64.net/html/wer-weiss-was/beispiele-i…
Noch etwas Grundsätzliches:
Um Floats sinnvoll einzusetzen, sollte man sie möglichst nur auf Block-Tags anwenden (DIV, P, …), also solche Tags, die am Ende immer einen Zeilenvorschub bewirken. Andernfalls kann das zu sehr unerwünschten Effekten führen, insbes. wenn Links damit formatiert werden. (SPAN, IMG und A bspw. sind im Gegensatz dazu Inline-Tags.)
Solltest Du feststellen, dass es sinnvoll ist, an der ein oder anderen Stelle den „float“ zu unterbrechen bzw. zu beenden, kann das z.B. mit einem
erfolgen.
Weiters schau’ Dich mal bei DrWeb.de um.
HTH, CU DannyFox64