CODEWITHSUNDEEP
cssiframeposition
learningtech
learningtech

Reputation: 33683

right and bottom ignored when position fixed iframe

I have the following code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head></head>
   <body>
      <iframe src="http://jl.evermight.net" style="overflow:scroll; display:block; position:fixed; top:10px; bottom:10px; right:10px; left:10px;"></iframe>
   </body>
</html>

how come my iframe doesn't fill the entire browser window leaving only a 10 px space between top, right, bottom and left of the browser window? If I replaced the iframe tag with a p tag, while keeping the style rule, then it works with the p tag.

It seems the iframe is ignoring my right and bottom css rule. How do I make the iframe acknowledge the right and bottom rule?

Upvotes: 4

Views: 2973

Answers (3)

MarkP
MarkP

Reputation: 481

If, for some reason you do not want the surrounding div and you need to use position:fixed instead of absolute you could use the calc function in a width and height setting.

Upvotes: 0

leoap
leoap

Reputation: 1729

As Alan Shortis suggested:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head></head>
    <body>
        <div style="position:fixed; top:10px; bottom:10px; right:10px; left:10px;">    
            <iframe src="http://jl.evermight.net" style="overflow:scroll;width:100%;height:100%;"></iframe>
        </div>
    </body>
</html>

Upvotes: 5

Santiago Rebella
Santiago Rebella

Reputation: 2449

with

 position:absolute;

works?

Upvotes: 3

Related Questions