Inhalt mit Panel überdecken

23/12/2008 - 10:14 von Albert Andersson | Report spam
Hallo zusammen

Ich habe folgenden seiten aufbau:

<div>
<div id="Header">
</div>
<div>
<div id="Popup" />
<div id="Content">


Floatende DIV's und sonstiges <<




</div>
</div>
<div id="Footer">
</div>
</div>

Was ich machen möchte ist, dass das div "Popup" das komplette div
"Content" überdeckt.

Hier mein CSS:

#divHead
{
height: 125px;
background-color: #65727E;
margin-left: auto;
margin-right: auto;
position:relative;
}
#divContent
{
width: 100%;
/*background-color: #000;*/
position:relative;
}
#divFooter
{
text-align: center;
background-color: #B1BFCD;
float: left;
padding-top: 10px;
padding-bottom: 10px;
width: 100%;
position:relative;
}
.pnlPopup
{
width: 100%;
height: 100px;
background-color: blue;
position: relative;
}

Ist position relative, liegt der ganze Block oben auf. Bei absolut
bleigt "Content" im Vordergrund.
 

Lesen sie die antworten

#1 Albert Andersson
23/12/2008 - 11:33 | Warnen spam
Albert Andersson schrieb:
#divHead
{
height: 125px;
background-color: #65727E;
margin-left: auto;
margin-right: auto;
position:relative;
}
#divContent
{
width: 100%;
/*background-color: #000;*/
position:relative;
}
#divFooter
{
text-align: center;
background-color: #B1BFCD;
float: left;
padding-top: 10px;
padding-bottom: 10px;
width: 100%;
position:relative;
}


.pnlPopup
{
width: 100%;
height: 100%;
background-color: black;
position: absolute;
z-index: 1;
}



Ich habe obige Änderung am CSS vorgenommen und im FF sowie im IE7
funktioniert es nun ... der IE6 hat probleme mit Height:100%

top 1px, bottom 1px funktioniert auch für FF und IE7 aber nicht für IE6
... Gibt es da einen Hack?

Ähnliche fragen