| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Outer Subframe</title> |
| <style> |
| @font-face { |
| font-family: Ahem; src: url(Ahem.ttf); |
| } |
| |
| html, body { |
| font-family: Ahem; |
| -webkit-text-size-adjust: none; |
| } |
| |
| iframe { |
| width: 100px; |
| height: 100px; |
| border: 1px solid black; |
| } |
| </style> |
| </head> |
| <body> |
| <p>The round pegs in the square holes. |
| <iframe title="Inner Subframe"></iframe> |
| </p> |
| <script> |
| addEventListener("load", () => { |
| const subframe = document.querySelector("iframe"); |
| subframe.addEventListener("load", () => { |
| parent.postMessage("subframeLoaded", "*"); |
| }); |
| subframe.srcdoc = ` |
| <head> |
| <title>Inner Subframe</title> |
| <style> |
| @font-face { |
| font-family: Ahem; src: url(Ahem.ttf); |
| } |
| html, body { |
| font-family: Ahem; |
| -webkit-text-size-adjust: none; |
| } |
| </style> |
| </head> |
| <body> |
| <a href='https://webkit.org'>The ones who see things differently.</a> |
| </body>`; |
| }); |
| </script> |
| </html> |
