I want to set height of a div as height of window when page loads... 

So I used the below code : 

```
 $(document).ready(function () {
            var x = screen.availWidth;
            var y1 = screen.availHeight;
            var y2 = screen.Height;
            var w = $(window).height();
            var d = $(document).height();
            alert('availHeight : ' + y1);
            alert('Height : ' + y2);
            alert('window : ' + w);
            alert('document : ' + d);
            $('#OuterDiv').css({ 'height': w });
            //alert($('#OuterDiv').css('height'));
        });   //End Of $(document).reedy

```

Problem #1:

When screen resolution changes that div still have previous height.  

How can I fix that ? 

Problem #2:

I want height=100% for that div and because of some css problems I used jQuery.  

But when page is loading (during page load) that div's height is the height of it's content and after that jQuery worked, that div gets window's height. 

I think this is not nice during page load.  

How can I fix this issue? 

`height:100%` does not work for that div: 

Here is the reason -> [LINK](https://stackoverflow.com/questions/7579294/increasing-height-of-a-div-while-dynamically-loading-content-its-height-is-100)

Thanks in advance