enchilada: Fixe Leiste überlagert Seiteninhalt

SELF-Forum

Fixe Leiste überlagert Seiteninhalt

enchilada
– Informationen zu den Bewertungsregeln

Hallo,

ich habe den Artikel von Dennis Riehle gelesen, und mir da ein paar Zeilen CSS-Code entnommen.

Jetzt habe ich das Problem, dass die Leiste (einmal Footer und einmal Header) den Rest der Seite verdeckt. Ich müsste also die Seite erst UNTER dem Header beginnen lassen bzw. über dem Footer enden lassen.

Dieser Code wird benutzt:

  
 <div id="optionlist">  
  OPTIONLIST  
 </div>  


  
#optionlist  
{  
 position:fixed;  
 top:0px;  
 left:0px;  
 right:0px;  
 text-align:center;  
 background-color:#fff;  
 width:100%;  
 border-bottom:1px solid #000;  
}

Wie bewerkstellige ich das?

Lg
Enchilada

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Fixe Leiste überlagert Seiteninhalt

    Lukas
    – Informationen zu den Bewertungsregeln

    Hey
    das position:fixed bewirkt in diesem Kontext, dass sich das Element an die mit "top" und "left" angegebene Position des Browserfensters heftet, und dabei eben ggf. die darunterliegenden Inhalte verdeckt.
    Soll der restliche Content tiefer erscheinen, empfehle ich, wie in diesem beispiel, den eigentlichen Inhalt in ein eigenes Div zu setzen, das dann mit style="padding: 40px 0" ein wenig Abstand zum oberen und unteren Seitenrand erhält:

      
<body>  
<div id="header">  
    <!--Headertext...-->  
</div>  
<div id="contentWrapper" style="padding: 40px 0">  
    <!--Der eigentliche Content-->  
</div>  
<div id="footer">  
    <!--Footertext...-->  
</div>

    Wobei der erste Paddingparameter natürlich je nach Höhe von Header und Footer variieren kann u. sollte.

    Lg
    Lukas

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln