L00NIX: Absolut bzw Fixed posit. DIV für Navigation als Frameersatz

Hallo zusammen.

Ich habe ein Grundgerüst für eine Webseite, in etwa so:

<body>
<div id="container">
<div id="logo">
...
</div>
<div id="navigation">
...
</div>
<div="Hauptteil">
...
</div>
...
</div>
</body>

Das DIV mit der id=navigation soll nun absolut bzw. fixed (non-IE) auf der linken Seite bildfüllend (also Höhe = 100%) positioniert sein. Das Logo liegt aber noch darüber, es muss also etwas nach unten "gepadded" sein, was also die Navigation etwas tiefer ansetzt.

Ich experimentiere gerade mit dem height-Attribut rum, finde aber nichts passendes.

Hat jemand von euch eine Lösung, weil sich eventuell schon selbst damit herumgeschlagen?

Gruß
L00NIX

  1. Hallo L00NIX.

    <div id="logo">

    Definiere hierfür eine Größe.

    <div id="container">

    Definiere hierfür einen mindestens genauso großen Abstand für margin-top, wie das Logo-DIV groß ist.

    Gruß, Ashura

    --

    Selfcode: sh:( fo:| ch:? rl:? br:^ n4:& ie:% mo:| va:) de:[ zu:| fl:( ss:{ ls:# js:|
  2. hi,

    Das DIV mit der id=navigation soll nun absolut bzw. fixed (non-IE) auf der linken Seite bildfüllend (also Höhe = 100%) positioniert sein. Das Logo liegt aber noch darüber, es muss also etwas nach unten "gepadded" sein, was also die Navigation etwas tiefer ansetzt.

    geht's etwas genauer ... was hast du jetzt eigentlich vor?
    soll das logo ebenfalls fixed sein?

    Ich experimentiere gerade mit dem height-Attribut rum, finde aber nichts passendes.

    zunächst mal würde ich die positionierung dann halt mal etwas von oben absetzen, über einen passenden wert für top.
    wenn das nicht bringt, was du willst ... s.o., bitte genauer beschreiben.

    gruß,
    wahsaga

    --
    "Look, that's why there's rules, understand? So that you _think_ before you break 'em."
    1. hi,

      Das DIV mit der id=navigation soll nun absolut bzw. fixed (non-IE) auf der linken Seite bildfüllend (also Höhe = 100%) positioniert sein. Das Logo liegt aber noch darüber, es muss also etwas nach unten "gepadded" sein, was also die Navigation etwas tiefer ansetzt.

      geht's etwas genauer ... was hast du jetzt eigentlich vor?
      soll das logo ebenfalls fixed sein?

      OK, nochmal etwas detaillierter in ASCII-Art ;o)

      +--------------------------+
      |logo (fest)               |
      +------+-------------------+
      |nav   |                   |
      |(fest)|                   |
      |      |    Hauptteil      |
      |      |                   |
      |      |                   |
      |      |                   |
      +------+-------------------+

      Das Problem ist, wenn die Links in der Navigation zu lang werden, muss natürlich ein Scrollbalken erscheinen und zwar von oben (direkt unter Logo) bis unten (Browserfensterrand). Dafür muss ich wiederum für das Navigations-DIV eine Höhe definieren. Prozentuale Angaben sind doof, weil irgendwann bei Änderung der Fenstergröße der Scrollbalken aus dem Anzeigebereich rausrutscht. :-(

      Ich hoffe, das hilft weiter, das Problem zu verstehen...

      L00NIX

      1. Habe es hinbekommen:

        +--------------------------+
        |logo (fest)               |
        +------+-------------------+
        |nav   |                   |
        |(fest)|                   |
        |      |    Hauptteil      |
        |      |                   |
        |      |                   |
        |      |                   |
        +------+-------------------+

        Man muss beim Navigations-DIV einfach auch den Abstand zum Boden angeben:

        #navigation
        {
            position: absolute;

        top: 5em;
            bottom: 0em;
        }
        #navigation[id]
        {
            position: fixed;
        }

        YEAH!