--- a/devtools/server/actors/highlighters/shapes.js
+++ b/devtools/server/actors/highlighters/shapes.js
@@ -1447,18 +1447,18 @@ class ShapesHighlighter extends AutoRefr
       coordParser: this.ellipsePoints.bind(this)
     }, {
       name: "inset",
       prefix: "inset(",
       coordParser: this.insetPoints.bind(this)
     }];
     const geometryTypes = ["margin", "border", "padding", "content"];
 
-    // default to border
-    let referenceBox = "border";
+    // default to border for clip-path, and margin for shape-outside
+    let referenceBox = this.property === "clip-path" ? "border" : "margin";
     for (let geometry of geometryTypes) {
       if (definition.includes(geometry)) {
         referenceBox = geometry;
       }
     }
     this.referenceBox = referenceBox;
 
     this.useStrokeBox = definition.includes("stroke-box");