float:left erzwingen bzw. Umbruch verhindern

[Klaus Herzberg]

Hallo,
ich moechte gerne mehrere DIVs nebeneinander darstellen. Diese
Darstellung wird breiter als das Browserfenster, was in hier erwuenscht
ist.
Leider wird beim Erreichen der Fensterbreite vor dem naechsten DIV
umgebrochen und dieser unten links dargestellt. Dies moechte ich
verhindern.
Versuche mit display:table oder table-cell funktionieren nicht ausreichend.
Ideen?

Vielen Dank. mfg. klaus.

[Norbert Melzer]

Post by Klaus Herzberg
Hallo,
Versuche mit display:table oder table-cell funktionieren nicht ausreichend.
Ideen?

Funktioniert nicht in IE bis Version 7 Beta 3 (neuere habe ich nicht
testen können :-) ) In Opera 9 und aktuellen Geckos aber stellt es
wunderbar dar.

Also entweder Du nutzt wirklich eine Tabelle oder lebst mit dem Umbruch
der Floats.

Post by Klaus Herzberg
Vielen Dank. mfg. klaus.

MfG
Norbert

[Klaus Herzberg]

Hallo,

Post by Norbert Melzer

Post by Klaus Herzberg
Hallo,
Versuche mit display:table oder table-cell funktionieren nicht ausreichend.
Ideen?

Funktioniert nicht in IE bis Version 7 Beta 3 (neuere habe ich nicht
testen können :-) ) In Opera 9 und aktuellen Geckos aber stellt es
wunderbar dar.

ja, so habe ich es auch feststellen muessen.

Post by Norbert Melzer
Also entweder Du nutzt wirklich eine Tabelle oder lebst mit dem Umbruch
der Floats.

da die Seite nur fuer meinen privaten Gebrauch ist und ich immer Gecko
nutze, kann ich auch die Divs nehmen.

Grundsaetzlich ist es aber schon seltsam, dass man den Umbruch nicht per
Anweisung verhindern kann.

Danke. mfg. klaus.

[Benjamin Niemann]

Post by Klaus Herzberg

Post by Norbert Melzer
Also entweder Du nutzt wirklich eine Tabelle oder lebst mit dem Umbruch
der Floats.

da die Seite nur fuer meinen privaten Gebrauch ist und ich immer Gecko
nutze, kann ich auch die Divs nehmen.
Grundsaetzlich ist es aber schon seltsam, dass man den Umbruch nicht per
Anweisung verhindern kann.

Floats sind auch nicht dazu gedacht, solche fixen Anordnungen zu erstellen.
Vielmehr dienen sie dazu, 'fließende' Element, die neben dem eigentlichen
Inhalt herlaufen, zu erstellen. Diese können sich quasi einen Platz suchen,
wo sie am besten hinpassen.

Insbesondere was die Anordnung in horizontaler Richtung anbelangt, bietet
CSS nur bescheidene Möglichkeiten - was im Sinne des Erfinders ist, da die
horizontale Breite ja vom Browser(nutzer) fest vorgegeben wird, und vom
Autor aber nicht vorhergesehen/erzwungen werden kann. Also der Content muß
sich der Breite anpassen (und dazu gehört dieser Umbruch). Im Gegensatz zur
Seitenhöhe, die sich dem Content anpasst.

[Ich bin]

Klaus Herzberg schrieb

Post by Klaus Herzberg
Versuche mit display:table oder table-cell funktionieren
nicht ausreichend.
Ideen?

Hast du es schon mit "Div{display:inline;}" probiert?

viele Grüße
Michael

[Michael Friedrich]

Klaus Herzberg schrieb

Post by Klaus Herzberg
Versuche mit display:table oder table-cell funktionieren
nicht ausreichend.
Ideen?

Hast du es schon mit "Div{display:inline;}" probiert?

viele Grüße
Michael

[Norbert Melzer]

Post by Ich bin
Klaus Herzberg schrieb

Post by Klaus Herzberg
Versuche mit display:table oder table-cell funktionieren
nicht ausreichend.
Ideen?

Hast du es schon mit "Div{display:inline;}" probiert?
viele Grüße
Michael

Das bewirkt lediglich, daß aus dem Block-Element ein inline Element
wird. Im Prinzip kannste dann auch gleich statt des <div> ein <span>
nehmen, ist dann das gleiche...
Hat also mit dem Problem nichts zu tun, denn Inline Elemente werden auch
umgebrochen, ist auch ganz gut so, sonst hätte man immer ein Problem
wenn man einen Link am Zeilenende stehen, der würde dann ja nicht
umgebrochen werden.
Aber ich rede zuviel,

Bis die Tage
Norbert

[Michael Friedrich]

Guten Morgen,

Norbert Melzer schrieb

Post by Norbert Melzer
Das bewirkt lediglich, daß aus dem Block-Element ein
inline Element wird. Im Prinzip kannste dann auch gleich
statt des <div> ein <span> nehmen, ist dann das gleiche...
Hat also mit dem Problem nichts zu tun, denn Inline Elemente
werden auch umgebrochen,

Stimmt, jedoch vergaß ich den Hinweis auf die Eigenschaft
"white-space:nowrap"; das sollte - ohne das ich es probiert habe - auch
mit Div-Elementen klappen(!?). Wäre jedenfalls mal ne Idee zum
ausprobieren...

Post by Norbert Melzer
Aber ich rede zuviel,

Ich auch ;-)
Das alles nämlich kann man bspw. im selfhtml lesen...

viele Grüße
Michael

[Klaus Herzberg]

Hallo,

Post by Michael Friedrich
Guten Morgen,
Norbert Melzer schrieb

Post by Norbert Melzer
Das bewirkt lediglich, daß aus dem Block-Element ein
inline Element wird. Im Prinzip kannste dann auch gleich
statt des <div> ein <span> nehmen, ist dann das gleiche...
Hat also mit dem Problem nichts zu tun, denn Inline Elemente
werden auch umgebrochen,

Stimmt, jedoch vergaß ich den Hinweis auf die Eigenschaft
"white-space:nowrap"; das sollte - ohne das ich es probiert habe - auch
mit Div-Elementen klappen(!?). Wäre jedenfalls mal ne Idee zum
ausprobieren...

nein klappt leider nicht. Fuehrt nur dazu, dass der Text in den Divs
nicht umgebrochen wird.

<nobr> klappt uebrigens auch nichtt:)

mfg. klaus.

[Michael Friedrich]

Klaus Herzberg schrieb

Post by Klaus Herzberg
nein klappt leider nicht. Fuehrt nur dazu, dass der
Text in den Divs nicht umgebrochen wird.
<nobr> klappt uebrigens auch nichtt:)

Tjaaaa, dann muss man sich was anderes überlegen ;-)

Die Frage ist, warum wird - trotz float:left - überhaupt umgebrochen?

Du musst dir vorstellen, daß auf einem DinA4-Blatt auch nicht mehr Platz
ist und du deswegen umbrechen muss. Und wenn du noch mehr Bilder oder so
nebeneinander draufkleben willst, musst du dir ein größeres Blatt
besorgen oder ein zweites daneben ankleben.

Das Blatt, hier Body hat standartig 100% Breite vom Browserfenster. Und
das ist dir offenbar zu wenig. Aber man kann was dagegen tun. Es gibt 2
Möglichkeiten, eine davon ist nicht ganz sauber, aber scheint trotzdem
bei allen Browsern zu funktionieren.

Ich weiss, es ist gemein, jedoch pädagogisch und es macht Spaß ;-))

viele Grüße
Michael

[Stefan David]

Post by Ich bin
Hast du es schon mit "Div{display:inline;}" probiert?

Da es sich hier um einen float handelt, wird display:inline ingnoriert.
Ein gefloatetes Element ist immer ein Blockelement[1].

Gleichzeitig ist das aber der nette Nebeneffekt, dass der Bug mit den
doppelten Margins bei Floats im IE < IE7 dadurch neutralisiert wird,
ohne das es auf andere Browser Auswirkungen hat.

Der Stefan

[1] http://www.w3.org/TR/REC-CSS2/visuren.html#q24

[Stefan David]

Post by Ich bin
Hast du es schon mit "Div{display:inline;}" probiert?

Da es sich hier um einen float handelt, wird display:inline ingnoriert.
Ein gefloatetes Element ist immer ein Blockelement[1].

Gleichzeitig hat es aber den netten Nebeneffekt, dass der Bug mit den
doppelten Margins bei Floats im IE < 7 dadurch neutralisiert wird, ohne
dass es auf andere Browser Auswirkungen hat.

Der Stefan

[1] http://www.w3.org/TR/REC-CSS2/visuren.html#q24

[Michael Friedrich]

Stefan David schrieb

Post by Stefan David

Post by Ich bin
Hast du es schon mit "Div{display:inline;}" probiert?

Da es sich hier um einen float handelt, wird display:inline
ingnoriert. Ein gefloatetes Element ist immer ein Blockelement[1].

Nun - ich habe auch nicht gesagt, daß er Inline-Elemente floaten soll
;-)

Aber ich glaube, er hat sowieso das Problem gelös - man hört (liest) nix
mehr von ihm.

Post by Stefan David
Gleichzeitig hat es aber den netten Nebeneffekt, dass der
Bug mit den doppelten Margins bei Floats im IE < 7 dadurch
neutralisiert wird, ohne dass es auf andere Browser Auswirkungen
hat.

Der IE macht mir momentan andere Probleme, bspw. daß er die Div-Blöcke
trotz 0-Außenabstand nicht nahtlos aneinander fügt.

viele Grüße
Michael

[Klaus Herzberg]

Hallo,

Post by Michael Friedrich
Stefan David schrieb

Post by Stefan David

Post by Ich bin
Hast du es schon mit "Div{display:inline;}" probiert?

Da es sich hier um einen float handelt, wird display:inline
ingnoriert. Ein gefloatetes Element ist immer ein Blockelement[1].

Nun - ich habe auch nicht gesagt, daß er Inline-Elemente floaten soll
;-)
Aber ich glaube, er hat sowieso das Problem gelös - man hört (liest) nix
mehr von ihm.

aber ich lese natuerlich noch mit. Loesen konnte ich das Problem nicht
befriedigend. Wenn es in allen Browsern funktionieren soll, gehen bisher
nur Tabellen. Ich nutze Gecko und daher reichen Divs. Ist ja nur eine
private Seite.

mfg. klaus.

[Michael Friedrich]

Klaus Herzberg schrieb

Post by Klaus Herzberg
aber ich lese natuerlich noch mit. Loesen konnte ich
das Problem nicht befriedigend. Wenn es in allen
Browsern funktionieren soll, gehen bisher nur Tabellen.
Ich nutze Gecko und daher reichen Divs. Ist ja nur eine
private Seite.

Naja, du kannst dem Body-Element einem width-Attribut zuweisen, oder
besser einen allumfassenden Haupt-Div mit der entsprechende Breite
kreieren. Dann kannste deine Elemente auch über den Bildschirmrand
setzen.

Das letztere zumindest ist eigentlich ein gängiges Verfahren.

viele Grüße
Michael

[Irmgard Schwenteck]

Hallo

Post by Klaus Herzberg
ich moechte gerne mehrere DIVs nebeneinander darstellen. Diese
Darstellung wird breiter als das Browserfenster, was in hier erwuenscht
ist.
Leider wird beim Erreichen der Fensterbreite vor dem naechsten DIV
umgebrochen und dieser unten links dargestellt. Dies moechte ich
verhindern.

min-width.
Wenn es sich um Bilder handelt und diese demzufolge eine definierte
Breite in px haben, kannst Du für den IE auch diesen Würgaround nutzen:
{width:expression(document.body.clientWidth > 900? "900px": "auto");

das wäre min-width:900px.

Gruß
Irmgard