I'm working on this overlay div that is supposed to cover the whole site so that I can focus the user on a box in the middle without popping up an alert box or something.

 

So I tried a lot of things and for the moment it looks quiet good (except IE), even when u resize BUT not when u start to scroll (after resizing off course).

 

So if anyone has an idea or knows this problem, u could help me out.

 

I've put the css down here, and I've tried to upload the file but I don't if it is going to work that well (I'm just new here)

 

CSS:

<style type="text/css">

html

{

height:auto;

min-height:100%;

}

body

{

margin:0;

padding:0;

height:auto;

min-height:100%;

}

#container

{

background:#CCC;

width:800px;

height:100%;

margin:0 auto;

}

 

#bluebox

{

background:#039;

height:400px;

}

 

#redbox

{

background:#C00;

height:200px;

}

#overlay

{

position:absolute;

min-width:800px;

width:100%;

height:auto;

min-height:100%;

margin:0;

background:#000;

filter:alpha(opacity=50);

-moz-opacity:0.5;

-khtml-opacity: 0.5;

opacity: 0.5;

clear:both;

}

 

#posbox

{

position:absolute;

float:left;

width:50%;

height:50%;

margin:0 25%;

background:#F00;

visibility:hidden;

}

 

#whitebox

{

position:relative;

width:200px;

height:100px;

margin:0 auto;

background:#000;

visibility:visible;

margin-top:200px;

}

 

</style>

css_tricks.html

You can http://www.phpprogrammeryard.com for refference. Here you get a lot of css coding. I think you can get help.

thx simanto

 

maybe ill found the solution there

 

archie