CSS position: fixed mit Bedingung

[MarkP]

Ich habe eine Webseite wo links auf allen Seiten mit

style="position: fixed"

ein Menü steht, dessen Höhe sich öfter mal ändern kann.
Das klappt auch prima, ob nun mit <table> oder <div>, solange der User eine Fenstergrösse und/oder Bildschirmauflösung hat, die höher ist als das Menü.
Ich brauche also ein Stück Code was zwar per default das Menü im Fenster fixiert, aber wenn die Fenstergrösse nicht reicht das Menü zusammen mit dem Rest der Seite scrollt.

Hat Jemand eine Idee dazu?

 

[RalphS]

Schau mal in Richtung css @Media Screen Direktiven und responsive design.

 

[netzgestaltung]

hört sich nach so einer Lösung an wobei ich mir class="menu-container" zur besseren demonstration ausgedacht habe:

.menu-container{
  position:fixed;
  height:100%;
  max-height:100vh;
  overflow-y:auto;
}

Das wäre ohne media query möglich weil es nicht nur auf den Screen sondern auch auf die Inhaltslänge ankommt.

Um es genauer zu sagen bräuchte es reduzierten Beispielcode, zb https://jsfiddle.net oder einen Link zur Problemseite.

 

[MarkP]

Die Problemseite existiert noch nicht, sprich ist erst in Arbeit, wobei "Problem" schon übertrieben ist.
Das Ganze wird eine Seite für einen Kumpel von mir, der braucht eigentlich keine Webseite, da geht es mehr um haben wollen als um brauchen.
Er will nun eine Webseite die aus nichts weiter als ein paar Textseiten mit Bildern drin besteht und ich habe ihm angeboten ich mache ihm das für umsonst, denn von einem Kumpel würde ich sowieso nichts verlangen und meine Kenntnisse reichen eh nicht um Geld dafür zu verlangen.
Wenn ich es nicht auf die Reihe bekomme, dann wird das Menu halt simpler Bestandteil der Seite, ohne CSS oder was und scrollt dann halt mit der Seite mit.

Was ich nicht verstehe (weil meine bescheidenen Kenntnisse offensichtlich nicht reichen) ist, wie der Container erkennt, ob das Menü länger ist als das Fenster hoch und wie er bei Bedarf zwischen fixed und mitscrollen umschaltet.
Ich hatte gestern noch bei Google gestöbert und die Experten realisieren dies anscheinend mit Javascript in einer onresize Funktion.

 

[GroMag]

ob das Menü länger ist als das Fenster hoch und wie er bei Bedarf zwischen fixed und mitscrollen umschaltet.

Das sind 2 komplett verschiedene Sachverhalte. Das eine ist den kompletten Container mit dem Pagescroll mitzuziehen. Das andere den Inhalt des Containers scrollbar zu machen. Und dafür (für beides) hat dir @netzgestaltung schon die Antwort geliefert.
Und ja, mir ist bewusst auf was du hinaus willst, und ja, das ist nur mit js lösbar. Die Frage ist hier eher, wie sinnvoll das ist. (Die finale Höhe des Nav-Containers kannst du erst nach dem Rendern ermitteln, damit ist css raus)

 

[MarkP]

Hui, stimmt, das hatte ich nicht mal begriffen, danke für die Aufklärung.
Ich stimme völlig zu, das Menu selbst scrollbar zu machen ist die deutlich einfachere Lösung.
Danke natürlich auch an @netzgestaltung für die Lösung.

 

[GroMag]

Wichtig ist auch zu verstehen, dass man nicht jeden Sonderfall abfangen kann (bzw sollte). Wenn wer unbedingt mit nem 640x480er Desktop unterwegs sein will, kann er gern tun, muss halt dann mit den Folgen leben.
Andererseits, will man Mobil/Tablet unterstützen, landet man wieder bei MediaQueries und einem "komplett" anderem UI (kein linksseitiges NavMenu, sondern in einem "Hamburger"-Menu versteckt zB).
Des weiteren, wenn das Nav zu groß ist, kann man vielleicht auch mal über die Sinnhaftigkeit dessen Contents nach denken.

 

[MarkP]

Ja klar.
Wie gesagt, das wird keine wichtige Seite, das fixed Menu war schon eine Idee von mir für eine Funktion die mein Kumpel gar nicht erwartet.
Ich bezweifle sogar, dass er jemals so viele Textseiten haben wird, dass das Menü dazu zu lang für Irgendwen wird, aber diese Möglichkeit wollte ich wenigstens auch noch einbauen.
Mit Unterstützung für Mobil- und sonstige Winzig-Displays fange ich gar nicht erst an, das wäre wie mit Kanonen auf Spatzen schiessen.