block formatting context und overflow

[Encoder]

Hallo
Kann ich ein <p> irgendwie so formatieren, dass es einen neuen "block formatting context" erzeugt und ich overflow trotzdem auf visible belassen kann? Der Abschnitt sollte nicht inline und nicht float sein, ich möchte ihn so haben wie er sich normalerweise auch verhält, also dass er seinenn kompletten vertikalen Platz ausnutzt. Er soll nur nicht "hinter" ein gefloatetes Element rutschen. Bei allen anderen Spielereien mit den auf der w3c-Seite angegebenen Stichwörtern verhält er sich wie inline.

Das Overflow brauche ich für eine Art Tooltip, das je nach Position aus dem Abschnitt hinaus ragen soll.

[apsel]

Om nah hoo pez nyeetz,

Das Overflow brauche ich für eine Art Tooltip, das je nach Position aus dem Abschnitt hinaus ragen soll.

Vielleicht helfen dir ja DJ-TUTs Ergebnisse.

Matthias

[Encoder]

Nicht so ganz, da gehts ja nur um Opera.

[apsel]

Om nah hoo pez nyeetz,

Es funktioniert aber in allen aktuellen Browsern.

Matthias

[Encoder]

Hi, also da gibts wirklich haufenweise Links. Manche funktionieren schon gar nicht mehr und der Rest befasst sich mit Opera und was da komisches passiert.
Bist du sicher dass da irgendwas auf mein aktuelles Problem zutrifft?

[apsel]

Om nah hoo pez nyeetz,

Bist du sicher dass da irgendwas auf mein aktuelles Problem zutrifft?

Das Overflow brauche ich für eine Art Tooltip, das je nach Position aus dem Abschnitt hinaus ragen soll

Da es dir um Tooltipps geht, denke ich, dass diese Lösung für dich interessant sein könnte. Auf meiner Seite ist es so ähnlich nur ohne inline-block und für HTML/CSS-Neulinge erläutert.

Matthias

[Encoder]

Wenn ich im ersten Link in so einer Box (in Firebug) overflow:auto hinzufüge, wird der Tooltip leider auch abgeschnitten. Das was Ingo da anstellt muss ich mir genauer anschauen. Da hab ich das noch nicht hingekriegt, dass irgendwas abgeschnitten wird.

[molily]

Hallo,

Es gibt verschiedene Eigenschaften, die BFC auslösen:

„Floats, absolutely positioned elements, inline-blocks, table-cells, table-captions, and elements with 'overflow' other than 'visible' (except when that value has been propagated to the viewport) establish new block formatting contexts.“
http://www.w3.org/TR/CSS21/visuren.html#block-formatting

Floats, inline-block und table-cell lösen Shrink-to-Fit aus und damit nimmt das Element nicht den gesamten horizontalen Platz ein. Selbige zusammen mit width:100% geht nicht, weil du sagst, dass das Element neben einem Float liegt und du BFC dazu nutzen willst, dass dessen Box nicht wie üblicherweise hinter dem Float liegt. Also muss die Breite flexibel sein.

Absolute Positionierung fällt ebenfalls heraus. Dann bleibt eigentlich nichts übrig, wenn du auch kein overflow:hidden bzw. overflow:auto verwenden kannst. overflow-x und overflow-y würden noch gehen, aber ich denke mal, der Tooltip kann sowohl horizontal als auch vertikale herausragen.

Ich glaube, du wirst da nur eine Lösung finden, wenn du mit einer festen Breite arbeitest, dann stehen nämlich die Shrink-to-fit-Eigenschaften zur Verfügung. Ist das irgendwie möglich?

Was würde dagegen sprechen, dem Absatz einfach ein margin-left bzw. margin-right zu geben, damit es nicht hinter dem Float liegt? Ist die Breite des Floats auch flexibel?

Mathias

[Encoder]

Hi, danke schon mal für die Ansätze

Was würde dagegen sprechen, dem Absatz einfach ein margin-left bzw. margin-right zu geben, damit es nicht hinter dem Float liegt? Ist die Breite des Floats auch flexibel?

Die Breite nicht, aber dessen Höhe. Auf der Seite liegen evtl. mehrere solche Abschnitte, wobei dann alle unterhalb dem Float die ganze verfügbare Breite einnehmen sollen.

Bisher sieht es so aus

float  Absatz 1 Absatz 1 Absatz 1
float  Absatz 1 Absatz 1 Absatz 1
float  Absatz 1 Absatz 1 Absatz 1
float

Absatz 2 Absatz 2 Absatz 2 Absatz 2
Absatz 2 Absatz 2 Absatz 2 Absatz 2
Absatz 2 Absatz 2 Absatz 2 Absatz 2
Absatz 2 Absatz 2 Absatz 2 Absatz 2

oder eben

float  Absatz 1 Absatz 1 Absatz 1
float  Absatz 1 Absatz 1 Absatz 1
float  Absatz 1 Absatz 1 Absatz 1
float
float  Absatz 2 Absatz 2 Absatz 2
float  Absatz 2 Absatz 2 Absatz 2
float  Absatz 2 Absatz 2 Absatz 2
float

Ich könnte schon meine Ansprüche ein bisschen zurück nehmen. Aber wenns da einen Trick gibt wär ich nicht böse.