skalierbare Linkleiste

[Der fette Mo]

Guten Tag allerseits,

ich grüble schon seit Stunden darüber wie man mein Problem ohne Tabellen und ohne display: table (was IE ja nicht versteht) lösen kann, aber mir fällt einfach nichts ein.

Folgende Liste

<ul id="mainnav">
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>

soll am Schluss folgendermaßen aussehen:

|----------|----------|----------|

Link   |   Link   |   Link   |

|----------|----------|----------|

Link   |   Link   |   Link   |

|----------|----------|----------|

und außerdem soll die Größe der "Felder" sich der Größe des Anzeigefensters anpassen. (Und natürlich sollen alle gleich groß sein!)

Fällt euch ein, wie man das ohne Tabellen in CSS umsetzen könnte und zwar so, dass auch IE7 (bzw. IE6 mit dem IE7-Script) das anzeigen kann?

Gruß,
Der fette Mo

[Cheatah]

Hi,

|----------|----------|----------|

Link	Link	Link
Link	Link	Link
----------	----------	----------
und außerdem soll die Größe der "Felder" sich der Größe des Anzeigefensters anpassen. (Und natürlich sollen alle gleich groß sein!)

also in diesem Fall 33.3% der Breite einnehmen.

Cheatah

[Der fette Mo]

Guten Tag Cheatah,

also in diesem Fall 33.3% der Breite einnehmen.

Da bin ich mir auch nicht so ganz sicher. (Stichwort Rundungsfehler der Browser) Vielleicht könnten 34% eine bessere Angabe sein. Was sagen deine Erfahrungen?

Gruß,
Der fette Mo

[Cheatah]

Hi,

Da bin ich mir auch nicht so ganz sicher. (Stichwort Rundungsfehler der Browser) Vielleicht könnten 34% eine bessere Angabe sein. Was sagen deine Erfahrungen?

meine Erfahrungen sagen, dass 3*34% auch in den Browsern 102% ergeben, während bei 3*33.3% ein Rest von 0.1% verbleibt, der stören kann. Schwierig wird es, wenn Du die Prozentwerte mit Pixel- oder (besonders) em-Werten kombinieren willst. Meine Erfahrungen sagen außerdem, dass es leichter wird, wenn Du vier oder fünf Items nebeneinander haben möchtest, weil der Prozentwert dann genauer wird ;-)

Cheatah

[Der fette Mo]

Hi,

|Schwierig wird es, wenn Du die Prozentwerte mit Pixel- oder (besonders) em-Werten kombinieren willst.

Genau das tue ich! Links neben der Linkleiste befindet sich nämlich das Seitenlogo. Ich war bei meiner ersten Antwort wohl noch nicht ganz bei der Sache... Also bei float: left und width: 33% rutschen mir (wegen dem Logo) jeweils 2 statt 3 Links in eine Zeile. Lösung parat?

Danke.

Gruß,
Der fette Mo

[Cheatah]

Hi,

|Schwierig wird es, wenn Du die Prozentwerte mit Pixel- oder (besonders) em-Werten kombinieren willst.
Genau das tue ich! Links neben der Linkleiste befindet sich nämlich das Seitenlogo.

wenn die Items in einem Element stecken, in dem sie den gesamten verfügbaren Platz einnehmen können, ist das wurscht. Schwierig wird es, wenn Du z.B. ein padding in em und/oder border in px angibst.

Also bei float: left und width: 33% rutschen mir (wegen dem Logo)

Wegen de_s_ Logo_s_. SCNR :-)

jeweils 2 statt 3 Links in eine Zeile. Lösung parat?

Sicher, dass das am Logo liegt?

Cheatah

[Der fette Mo]

Hi,

Also bei float: left und width: 33% rutschen mir (wegen dem Logo)

Wegen de_s_ Logo_s_. SCNR :-)

Und meine Mutter soll Deutsch am Gymnasium unterrichten? ;)

Sicher, dass das am Logo liegt?

Hat es, nachdem ich padding-left durch margin-left sowie width: 100% durch ein zusätzliches margin-right:0 ersetzt habe nicht mehr. Die 5 px border machen mir allerdings noch zu schaffen...

Gruß,
Der fette Mo

[Blaubart]

'Nabend.

Wegen de_s_ Logo_s_. SCNR :-)

Und meine Mutter soll Deutsch am Gymnasium unterrichten? ;)

Die Verwendung des Dativs an dieser Stelle ist ja nicht falsch, auch wenn das nicht alle wissen. Der Duden vermerkt dazu schon seit Ewigkeiten "umg. und österr. auch mit Dativ".