nicht angemeldet
letztes gefloatetes Element soll restliche Breite nutzen.
Guten Abend allerseits.
Gibt es eine Möglichkeit, ein gefloatetes Element dazu zu bewegen, nicht nur so breit zu werden "wie es muss", sondern die restliche Breite des Elternelementes auszunutzen?
width: 100% funtioniert nur, wenn dieses Element das einzige Kindelement seines Elternelementes ist.
Konkret sieht das so aus:
HTML
<ul id="eine_id">
<li>Eins</li>
<li>Zwei</li>
<li>Drei</li>
<li id="last_listitem">Vier</li>
</ul>
CSS
#eine_id li {
float: left;
}
Das li-Element mit der id "last_listitem" soll also den restlichen verfügbaren Platz einnehmen.
Konkret geht es mir um das auffüllen mit der Hintergrundfarbe der listitems, da die ungeordnete Liste die Höhe 0 hat.
Falls es alternativ möglich ist, dass die Liste die Höhe ihres höchsten gefloateten Kindelements annimmt (so, wie wenn die listitems als Inline-Elemente formatiert wären), wäre mir das auch recht.
Vielen Dank schon mal,
David
-
Hallo David.
Gibt es eine Möglichkeit, ein gefloatetes Element dazu zu bewegen, nicht nur so breit zu werden "wie es muss", sondern die restliche Breite des Elternelementes auszunutzen?
Ja; verpasse dem Elternelement einen von „visible“ abweichenden Wert für die overflow-Eigenschaft. (Im Normalfall bietet sich „auto“ an.)
Einen schönen Donnerstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hallo Ashura,
danke für die Antwort.
"auto" funktioniert soweit, sieht allerdings ein bisschen blöd aus, falls die Listitems mehrere Zeilen brauchen.
Ich habe es deswegen jetzt mit "visible" gemacht, dadurch ist die Liste zwar nur so hoch wie die erste Zeile (außer natürlich in unserem Lieblingsbrowser ;) ), aber für die meisten Fälle sollte das ausreichen.-
Korrektur:
Was in meiner Antwort steht, ist natürlich völliger Humbug und kam nur zustande, weil ich für das Elternelement noch eine height-Angabe hatte. Es funktioniert natürlich genau, wie Ashura es beschrieben hat, d.h. mitoverflow: auto;im Elternelement. Ist schon spät ;-)
Danke nochmal!
David
-
-