• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Probleme mit float?

J

Jury

Neues Mitglied
Ich bearbeite gerade ein freies Template und gestalte es für meine Homepage. Leider hab ich damit ein kleines Problem:

http://i.imgur.com/rtjyj.png

Das Bild sollte normalerweise nicht überstehen und im Browser von Eclipse ist das auch nicht der Fall. In allen anderen aber schon. Sobald ich das Bild nicht in die Klasse "left" oder "right" stecke steht es nicht mehr über, daher denke ich, dass float an der Sache schuld ist. Kann das sein?

HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/x - Pastebin.com

CSS: /* Design by Free CSS Templates http://www.freecsstemplates.org Released for - Pastebin.com

Ich hoffe jemand kann mir helfen, das Problem zu lösen.
 
Werbung:
Genau da lag das Problem :oops:, den Satz werde ich mir hoffentlich jetzt merken.

Danke für die Hilfe
 
Werbung:
Servus!

Also ich verzichte komplett auf das clearen. Ist viel zu unsauber. Du kannst besser dem Elternelement der gefloateten Elemente ein overflow:hidden; geben und das wars dann auch schon.
 
Zuletzt bearbeitet:
Code: 
overflow: hidden;

wirkt nur auf Elemente die eine feste Breite oder Höhe haben. gefloatete Elemente wie auch Elternelemente haben diese nicht zwingend. Zudem birgt der Einsatz von dieser Eigenschaft den Nachteil, dass ungewollt Inhalte des Webs "verschwinden" oder besser abgeschnitten werden könnten. Ich würde daher von dieser Methode abraten.
 
Es ist nicht "hidden", sondern
Code: 
overflow: auto;
Wenn man das dem Elternelement (wrapper) zuweist, kann man in der Tat auf's Clearen verzichten.
 
Werbung:
threadi schrieb:
Code: 
overflow: hidden;

wirkt nur auf Elemente die eine feste Breite oder Höhe haben. gefloatete Elemente wie auch Elternelemente haben diese nicht zwingend. Zudem birgt der Einsatz von dieser Eigenschaft den Nachteil, dass ungewollt Inhalte des Webs "verschwinden" oder besser abgeschnitten werden könnten. Ich würde daher von dieser Methode abraten.
Zum Vergrößern anklicken....


Hä? Ich kann overflow:hidden; immer auf das Elternelement anwenden. Vor allem wenn die keine feste Höhe haben. Z.B. content-wrap nen overflow zuweisen und sidebar und content floaten = fertig. Es ist schon richtig, dass das overflow:hidden dazu verwendet wird, um zb überschüssigen Inhalt "abzuschneiden", aber für floaten eignet es sich hervorragend. Und wenn einmal der Inhalt nicht korrekt angezeigt wird bzw. abgeschnitten wird, dann hat man unsauber gearbeitet. Das einzige wo man ein wenig aufpassen sollte ist, wenn man *{margin:0; padding:0;} einsetzt, dass dann die Bullets von Listen nicht angezeigt werden. Die kann man dann aber mit einem margin-left wieder einrücken ohne Probleme.

Also ich arbeite mit dieser Methode schon seit Jahren uns setze dabei umfangreiche Layouts um und habe nie Probleme, es sei denn, ich habe mal geschlafen.

Und das Block Elemente eine Breite von 100% haben, sollte ja bekannt sein und wenn sie gefloaten werden, dass sich diese dann immer auf ein minimum reduzieren auch. Ich kann es nur empfehlen.

Ich habe meinen Teilnehmern immer folgendes ans Herz gelegt:

Man kann jedes Layout mit HTML & CSS umsetzen, egal wie frickelig es auf den ersten Blick scheint. Setzten Sie als erstes einen Wrapper der die komplette Website umschließt. Dann alle kommen erst alle divs die untereinander liegen, darin dann die, die nebeneinander liegen, darin dann wieder die, die untereinander liegen, dann wieder die, die nebeneinander liegen usw.

Ohne dabei etwas ans Smartboard zu zeichnen vllt. ein klein wenig schwer zu verstehen oder auch zu erklären, aber es funktioniert hervorragend...

Aber diese konnten innerhalb von 3 Wochen ohne jegliche Vorkenntnisse wirklich umfangreiche und abgefahrene Layouts umsetzen. Dauerte zwar etwas länger aber dafür, dass die das erste mal mit HTML & CSS gearbeitet haben wirklich top.

Grüße
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben