diff --git a/src/dom.ts b/src/dom.ts
index 46ebdb8586..a9736d029f 100644
--- a/src/dom.ts
+++ b/src/dom.ts
@@ -275,17 +275,17 @@ export class ElementHandle<T extends Node = Node> extends js.JSHandle<T> {
       point.y += border.y;
     }
     const metrics = await this._world.delegate.layoutViewport();
-    // Give 6 (six) extra pixels to avoid any issues on viewport edge.
+    // Give 15 extra pixels to avoid any issues on viewport edge.
     let scrollX = 0;
-    if (point.x < 6)
-      scrollX = point.x - 6;
-    if (point.x > metrics.width - 6)
-      scrollX = point.x - metrics.width + 6;
+    if (point.x < 15)
+      scrollX = point.x - 15;
+    if (point.x > metrics.width - 15)
+      scrollX = point.x - metrics.width + 15;
     let scrollY = 0;
-    if (point.y < 6)
-      scrollY = point.y - 6;
-    if (point.y > metrics.height - 6)
-      scrollY = point.y - metrics.height + 6;
+    if (point.y < 15)
+      scrollY = point.y - 15;
+    if (point.y > metrics.height - 15)
+      scrollY = point.y - metrics.height + 15;
     return { point, scrollX, scrollY };
   }
 
diff --git a/test/assets/frames/frame.html b/test/assets/frames/frame.html
index d096087912..4fa926868f 100644
--- a/test/assets/frames/frame.html
+++ b/test/assets/frames/frame.html
@@ -2,8 +2,11 @@
 <script src='./script.js' type='text/javascript'></script>
 <style>
 body {
-  height: 100;
+  height: 100px;
   margin: 8px;
+  border: 0;
+  background-color: #555;
+
 }
 div {
   line-height: 18px;
diff --git a/test/assets/frames/nested-frames.html b/test/assets/frames/nested-frames.html
index 538d71cd22..d858d3285b 100644
--- a/test/assets/frames/nested-frames.html
+++ b/test/assets/frames/nested-frames.html
@@ -1,14 +1,17 @@
 <style>
 body {
     display: flex;
-    height: 100%;
+    height: 500px;
     margin: 8px;
 }
 
 body iframe {
     flex-grow: 1;
     flex-shrink: 1;
+    border: 0;
+    background-color: green;
 }
+
 ::-webkit-scrollbar{
     display: none;
 }
diff --git a/test/assets/frames/two-frames.html b/test/assets/frames/two-frames.html
index 979968844e..00324f0845 100644
--- a/test/assets/frames/two-frames.html
+++ b/test/assets/frames/two-frames.html
@@ -2,13 +2,14 @@
 body {
     display: flex;
     flex-direction: column;
-    height: 100%;
+    height: 400px;
     margin: 8px;
 }
 
 body iframe {
     flex-grow: 1;
     flex-shrink: 1;
+    border: 0;
 }
 </style>
 <iframe src='./frame.html' name='uno'></iframe>
diff --git a/test/elementhandle.spec.js b/test/elementhandle.spec.js
index bc270a1a4d..bbeb3fd3a7 100644
--- a/test/elementhandle.spec.js
+++ b/test/elementhandle.spec.js
@@ -35,7 +35,7 @@ module.exports.addTests = function({testRunner, expect, FFOX, CHROME, WEBKIT}) {
       const nestedFrame = page.frames().find(frame => frame.name() === 'dos');
       const elementHandle = await nestedFrame.$('div');
       const box = await elementHandle.boundingBox();
-      expect(box).toEqual({ x: 28, y: 276, width: 264, height: 18 });
+      expect(box).toEqual({ x: 24, y: 224, width: 268, height: 18 });
     });
     it('should return null for invisible elements', async({page, server}) => {
       await page.setContent('<div style="display:none">hi</div>');