Add extra height to the iframe (#10)

canonical-web-and-design · Mar 8, 2017 · fdfe028 · fdfe028
1 parent 8522257
commit fdfe028
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 5 deletions.
diff --git a/js/example.js b/js/example.js
@@ -34,7 +34,9 @@ function renderIframe(placementElement, html) {
   var resizeInterval = setInterval(
     function() {
       if (iframe.contentDocument.readyState == 'complete') {
-        iframe.height = iframe.contentDocument.body.scrollHeight + "px";
+        // Add extra spacing to catch edge cases
+        const frameHeight = iframe.contentDocument.body.scrollHeight + 10;
+        iframe.height = frameHeight + "px";
         clearInterval(resizeInterval);
       }
     },

diff --git a/pattern/card.html b/pattern/card.html
@@ -13,9 +13,14 @@
   </style>
 </head>
 <body>
-<div class="card">
-  <h2>title</h2>
-  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute.</p>
-</div>
+  <div class="card">
+    <h2>title</h2>
+    <p>
+      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+      veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
+      commodo consequat. Duis aute.
+    </p>
+  </div>
 </body>
 </html>