Can i use Iframe inside an Iframe?

HTML & CSS
, ,
8

Wouldn’t pulling in a nested iframe partially or fully obscure the parent iframe? I don’t understand why one might want to do this.

After reading a few opinions on the internet, including parts of W3C and MDN, I’m inclined to agree wtih @coothead, that nesting iframes is not possible.

One can give the illusion of nested iframes by putting the iframes in a parent container (such as a <div>) that has position:relative and assigning position:absolute to the to the iframe that you wish to appear inside and overlaying the other.

FWIW.

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>iframes, positioned</title>
<!--
https://www.sitepoint.com/community/t/can-i-use-iframe-inside-an-iframe/214310/
shahzadsiddiqui8
-->
    <style type="text/css">

div {
    display:table;
    position:relative;
    margin:0 auto;
}
iframe + iframe {
    position:absolute;
    left:0;
    top:0;
    right:0;
    bottom:0;
    margin:auto;
}

    </style>
</head>
<body>

<div>
    <iframe src="http://lorempixel.com/720/480" width="740" height="500"></iframe>
    <iframe src="http://lorempixel.com/480/320" width="500" height="340"></iframe>
</div>

</body>
</html>

Fixed dimensions.