float layout: grenzenloser text

Beitrag von **Nullpointer** » 07.01.2006, 00:02

neues problem vom css-analphabeten:

<div style="float:left;width:250px;">
<div>
</div>
</div>

das äußere div dient links als container für diverse sichtbare blöcke, die navigation etc. enthalten sollen.
in der regel füllen die inneren blöcke einfach das gesamte äußere div.
wenn jetzt aber ein zusammenhängender string in einen inneren block eingetragen wird, der die knapp 250px überschreitet, verlässt der text die divs.

max-width im inneren div einzustellen bringt auch nix.
gibt es dafür eine lösung? ich könnte mit abgeschnittenem text oder scrollbars leben. eine autosilbentrennung wird es wohl erst in hyperhtml geben, dass mit greenhorn 2007 released wird.

von **Anzeige von ABAKUS** »

Beitrag von **Babelfisch** » 07.01.2006, 00:21

overflow:hidden
overflow:scroll

Beitrag von **MonikaTS** » 07.01.2006, 02:05

wenn Du magst , dass der Text weiterhin lesbar bleibt, dann musst Du
overflow:auto nehmen,
hat jedoch den Nachteil, dass der IE, sollte der Text einmal nur eine Zeile lang sein,
sofort einen vertikalen Scrollbalken liefert und das ganze derart zusammendrückt, dass es unlesbar wird.

Dies kannst Du lösen indem Du dort wo Du overflow:auto verwendest genug padding-bottom gibst.
Wird zwar dann in Browser ein bisschen hoch, aber bleibt im IE lesbar.

Gibst Du dann dem ganzen noch ein ausreichendes
line-height sieht es sogar wirklich gut aus

wieso overflow auto
nun overflow scroll liefert immer einen Scrollbalken, egal ob er benötigt wird oder nicht,
das muss ja nicht sein

overflow hidden schneidet den Text, der zu breit zu hoch etc, wird, einfach ab.

lg
einfach

edit: Du kannst -um dies zu verhindern, dem inneren div aber auch ein
display:block geben und 100% width.
display block bricht Zeilen um
100% width geht, da der äußere div dies ja auffängt,
so der äußere div eine id hat , weil die schlägt in der Hierarchie der Befehle das div ohne id

von **Anzeige von ABAKUS** »

SEO Consulting bei ABAKUS Internet Marketing
Erfahrung seit 2002

persönliche Betreuung
individuelle Beratung
kompetente Umsetzung

Jetzt anfragen: 0511 / 300325-0.

Beitrag von **Babelfisch** » 07.01.2006, 02:48

overflow:auto macht in früheren Feuerfüchsen manchmal Probleme - vorher die Seite also auch mit Firefox 1.0 testen.

Was das display:block für DIV angeht - DIV ist auch ohne das schon ein Block-Element. 100% Breite kann dann wieder Probleme im IE < 6 (oder IE 6 im Quicksmode) machen, da der ein kaputtes Box-Modell hat.

Beitrag von **Nullpointer** » 07.01.2006, 12:18

also im firefox wäre mein problem mit overflow:auto gelöst.
aber der ie (6) lässt sich von keiner overflow einstellung steuern - das div wird immer so breit, wie der text. liegt das am quircksmode?

overflow:auto muss ich doch irgendwie für den ie hinbekommen oder?

schon mal danke für eure hilfe.

p.s. hat m$ schon mal angekündigt, wann der ie endlich mit der transparenz in png klar kommt? das ist ja mehr als peinlich. ich muss für jede hintergrundfarbe jpgs anfertigen, damit der schatten auf der hintergrunfarbe liegt.

Beitrag von **Nullpointer** » 07.01.2006, 12:31

ui. noch ein problemmit overflow auto im ff (1.0.7):
ich habe zwei von den inneren blöcken untereinander. im oberen sind links, im unteren text.
die linktexte werden per css :hover auf bold&italic geändert. während des renderings beim hovereffekt, flackert der text aus dem unteren div kurz über dem oberen div. sieht natürlich extrem bescheiden aus. ohne overflow passiert das nicht.

menno, bisher hatte ich immer nur mit dem ie probleme. hab kein bock auf tabellen :-/

Beitrag von **Babelfisch** » 07.01.2006, 15:00

Was overflow:auto im IE angeht - keine Ahnung. Der IE kommt dabei eigentlich ganz gut zurecht. Hast du vielleicht vergessen, die Breite des DIVs mit anzugeben?

Dein zweites Problem mit dem hover - ändere nie beim hover der Schriftstil! Dieses unschöne Flackern ist da unvermeidlich.