margin problem mit gefloateter box

[michaah]

Hallo Detlef;

danke für deine erklärungen.

Was ist mit "gefloatete element" gemeint,

Das Element, dem du ein float (left oder right) zugewiesen hast. Es hat damit _keinen_ Einfluss mehr auf umschließende oder nachfolgende Blockelemente, die sich im normalen Fluss befinden.

Manchaml sind die einfachsten erklärungen die wichtigsten. Ich habe "gefloatetes element" fälschlischerweise immer irgendwie mit "umfloatendem" und nicht mit "umfloateTem" (= gefloatete) element assoziert. Das war natürlich schlampig und und hat zu missverständnissen bei meiner vorstellung geführt.

oder die (nachfolge) box, die dadurch ja eigentlich aus dem normalen elementfluß genommen wird.

... Nur Texte und Inlineelemenente werden durch das gefloatete Element verdrängt bzw. umfließen es. (Bei dem Beispiel siehst du es, wenn du genau hinschaust.)

Puhhh, das steht doch noch mächtig denkarbeit an:

... Aber auch da ist es wohl ein assoziierungproblem: Ich stell(t)e mir immer die box als das sich verschiebende elemnt vor, obwohl ich ja weiß, dass rechts liegende boxen sich eigentlich unter den linksliegenden fortsetzen (soweit es kein float:right-boxen sind). Aber dein hinweis macht mir das nochmal klar, dass es die texte und inline-inhalte sind, die umfließen und dabei die sie umschließende box gewissermaßen mitnehmem. Vllt ist letzteres eine bildliche vorstellung, die den tatsachen am besten entspricht. Zumindest verhindert sie bei mir die falsche vorstellung, dass die box sich verschieben würde. Es ist der inhalt der box, der sich verschiebt.

Die neu dazugekommene kleine box unten links ist eigentlich meine navi box. Die war bislang mit position:absolute ganz nach rechts geklebt worden, unter den kopf bereich. Das klappt aber nur dann gut, wenn der kopfbereich eine feste höhe auf allen unterseiten hat ... was auf grund verschiedenzeiliger überschriften nicht der fall ist ...

Du könntest mal nachlesen, auf welches Element sich position:absolute bezieht.

Das ist mir soweit klar, in meinem fall ist das da html-element selbst.

Du solltest #navi vielleicht als erstes Element in #inhalt anordnen und ihm ein float:right verpassen.

Irgend eine andere idee, die NICHT erfordert, das navi element als erstes element in die #inhaltsbox zu schreiben? Wenn es gar nicht anders geht verpasse ich dem kopfberich doch noch eine fixe höhe und positioniere dann das navi absolut.

..Außerdem müsstest du dann die Regeln bei #inhalt p für diese wieder aufheben (#navi p {...}).
Sollte #navi nicht vielleicht auch eher eine Liste statt eines Divs mit Textabsätzen darin sein?

Noch etwas:
Entferne bitte die Inlinestyles und schreibe _alles_ ins zentrale CSS. Es wird damit übersichtlicher.

Du hast vollkommen recht, das soll natürlich auch im endergebnis nicht so sein, das habe ich nur so schnell aus dem orginal zusammenkopiert, navi ist natürlich eine liste und die styles gehören alle ins stylesheet. Ich schreibe das nur beim ausprobiern meist schnell in die elemente, damit es auch wirklich dort ankommt wo es hinsoll. Aber ich sollte wohl mal beginnen, in meinem steylesheet häufiger kommentare bzw. hinweise und merkzeichen einzufügen, damit ich schneller die jeweiligen elemente finde.

Danke nochmal, man wird sich hoffentlich weiterlesen ...

Michael