Strict Standards: Declaration of blogRouter::parseRoute() should be compatible with birdyRouteHelper::parseRoute($queryParts, $possible = Array) in /home/chrismic/public_html/templates/Diverso/routers/blog.php on line 7
How to make an iframe fit its parent element (or in any part of a page for that matter)

Warning: mb_detect_encoding() expects parameter 1 to be string, array given in /home/chrismic/public_html/birdy/db.php on line 19

Warning: mb_detect_encoding() expects parameter 1 to be string, array given in /home/chrismic/public_html/birdy/db.php on line 19

by


Warning: mb_detect_encoding() expects parameter 1 to be string, array given in /home/chrismic/public_html/birdy/db.php on line 19

In: Web Design

No Comments

Since we are in the age of CSS3, you can do this by using viewport units. These units allow you to specify sizes in terms of percentages of the viewport width and viewport height. This is the user's viewport, also known as screen. However, in all major browsers I've tried it, if you put an iframe inside a div, which is inside another div and positioned relative, the viewport units are relative to this div. And since 100 viewport height units mean 100% height, you can do like this:

<div id="parent">
    <div id="wrapper" style="position:relative">
        <iframe style="position:absolute;top:0px;width:100%;height:100vh;" src="http://anydomain.com"></iframe>
    </div>
</div>

I find this to be the best solution possible, since it is cross-domain, and displays exactly like you want it without any javascript or other complex stuff.

And most importantly, it works on all browsers, even mobile ones (tested on android and iphone)!


Strict Standards: Non-static method birdyComments::submitComment() should not be called statically in /home/chrismic/public_html/birdy/helpers/comments/inc_rate.php on line 166

Warning: mb_detect_encoding() expects parameter 1 to be string, array given in /home/chrismic/public_html/birdy/db.php on line 19

Leave a Reply   

The Sinner In Me (Chris Vulture Mix) by Chris Vulture on Mixcloud