Question

How can have the iframe to automatically takeup the whole space.

http://speedywap.com/ihome/?url=http://dell.com/ for example has the iframe only open upto half the window in mozilla firefox and ie6

How can I make sure that takes the maximum size of the screen. Is there a css or js to do this?

Answer 1

This should do the trick.

Option 1:

Since you are trying to use z-index you can just add position:absolute to .sourceView.

body {
    color: #000000;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 12px;
    overflow: hidden; /* add this to stop any double scrollbars */
}

.sourceView {
    height: 93%;
    width: 100%;
    z-index: 10;
    position: absolute; /* add this */
}

Option 2:

html,body{
    height:100%;
}
body {
    color: #000000;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 12px;
    overflow: hidden; /* add this to stop any double scrollbars */
}

Option 3:

I have a javascript/jQuery solution over here:
Static container height combined with a dynamically sized container, possible?

http://jsfiddle.net/tw16/X5rWb/