horizontal scrollbare Liste mit verschiedener breite

[kajetan]

Hallo
das Layout meiner Website sieht ungefähr so aus: Oben ein Header mit 100% Breite darunter haben ich den Hauptteil mit ca. 75% Breite und daneben eine Seitenleiste mit 25% breite.
In den Hauptteil soll nun eine weitere Navigation kommen. Diese Navigation soll von der Art her wie die auf der Apple Homepage unter dem Punkt Mac sein.
Also eine horizontal scrollbare Liste.
Realisiert habe ich das bis jetzt so, ich habe im Hauptteil div einen div Navigation gemacht in dem sich eine Liste ul befindet.
Der Navigations div hat die Eigenschaft overflow:auto; und damit die Liste horizontal angeordnet wird habe ich bei den li float verwendet.
Ein Scrollbalken taucht aber nur auf wenn ich für die ul eine feste ausreichend große Breite eingebe. Gebe ich keine Breite ein wandern die li einfach nach unten wenn die Breite erreicht ist.

Da die Navigation an mehreren Seiten eingesetzt werden soll, ist sie immer auch unterschiedlich breit. Von daher ist die Lösung mit einer festen Breite bei ul auch nicht möglich.

Gibt es eine Lösung für mein Problem? Habe gestern ewig gegoogelt und nichts gefunden.
Vielen dank für eure Hilfe.

[Shadowcrow]

hi $name,

Realisiert habe ich das bis jetzt so, ich habe im Hauptteil div einen div Navigation gemacht in dem sich eine Liste ul befindet.
Der Navigations div hat die Eigenschaft overflow:auto; und damit die Liste horizontal angeordnet wird habe ich bei den li float verwendet.

wieso float?

  
#Navigation ul li {  
    display: inline;  
    }

sollte doch reichen damit die liste horizontal ist?

gruss
shadow

[Kajetan]

hallo shadow

wieso float?

#Navigation ul li {
    display: inline;
    }

> sollte doch reichen damit die liste horizontal ist?  
  
Weil meine Liste aus einem kleinen Bild und einen Text dazu besteht diese sollen untereinander stehen. Wenn ich display:inline; verwende steht die Beschreibung auch neben dem Bild.  
Außerdem habe ich bei display inline genau das gleiche Problem wie bei float. und zwar dass er eine neue Zeile beginnt sobald die volle Breite erreicht ist.  
  
Kajetan

[suit]

Außerdem habe ich bei display inline genau das gleiche Problem wie bei float. und zwar dass er eine neue Zeile beginnt sobald die volle Breite erreicht ist.

Gib dem umgebenden Element eine entsprechende Breite.

float oder inline-block bieten in deinem Fall keinen Vorteil.

[kajetan]

Hallo suit

Gib dem umgebenden Element eine entsprechende Breite.

das umgebende Element ist ja ul oder? Da ich aber in der Liste eine unterschiedliche Anzahl von Elementen habe ist die Breite nicht konstant. Darin besteht ja das ganze Problem.

Kajetan

[suit]

das umgebende Element ist ja ul oder? Da ich aber in der Liste eine unterschiedliche Anzahl von Elementen habe ist die Breite nicht konstant. Darin besteht ja das ganze Problem.

Du gibst die Elemente aber vermutlich durch irgend eine Logik aus - da das Bild/Thumbnail vermutlich immer die selbe Breite hat, ist dir die daraus resultierende Breite verm. bekannt.

[kajetan]

Hallo suit

Du gibst die Elemente aber vermutlich durch irgend eine Logik aus - da das Bild/Thumbnail vermutlich immer die selbe Breite hat, ist dir die daraus resultierende Breite verm. bekannt.

geschrieben ist die Seite selbst in xhtml. Layout halt mit css.
Ich wollte die Navigation an mehreren "unter" Seiten einsetzten. Dabei habe ich immer eine unterschiedliche Anzahl von Thumbnails. So dass ich im css code kein feste Breite vergeben kann. Oder gibt es in css irgend eine Möglichkeit die Breite abhängig von der Anzahl der Listen-Elemente zu machen?

Kajetan

[suit]

Oder gibt es in css irgend eine Möglichkeit die Breite abhängig von der Anzahl der Listen-Elemente zu machen?

Nein, dafür wäre ein Vorfahrenselektor notwendig, den es lt. verschiedenster Quellen "niemals" gegen wird.

[kajetan]

Nein, dafür wäre ein Vorfahrenselektor notwendig, den es lt. verschiedenster Quellen "niemals" gegen wird.

Also muss ich quasi auf jeder Seite die Breite extra definieren?

Kajetan

[suit]

Also muss ich quasi auf jeder Seite die Breite extra definieren?

Wenn du den (X)HTML-Code auch auf jeder Seite "extra" schreibst, ist das doch kein Problem?. Ansonsten wie gesagt: wenn du die Dinger mit einer Scriptsprache in einer Schleife ausgibst, lass die Berechnung von dieser durchführen.