diff --git a/browser/devtools/styleinspector/test/browser_ruleview_add-rule_01.js b/browser/devtools/styleinspector/test/browser_ruleview_add-rule_01.js
index 81fbbfb9df6b..21fe13a00275 100644
--- a/browser/devtools/styleinspector/test/browser_ruleview_add-rule_01.js
+++ b/browser/devtools/styleinspector/test/browser_ruleview_add-rule_01.js
@@ -22,7 +22,7 @@ let PAGE_CONTENT = [
 const TEST_DATA = [
   { node: "#testid", expected: "#testid" },
   { node: ".testclass2", expected: ".testclass2" },
-  { node: ".class1.class2", expected: ".class1" },
+  { node: ".class1.class2", expected: ".class1.class2" },
   { node: "p", expected: "p" }
 ];
 
@@ -95,4 +95,4 @@ function* testNewRule(view, expected, index) {
   let lastRule = textProps[textProps.length - 1];
   is(lastRule.name, "font-weight", "Last rule name is font-weight");
   is(lastRule.value, "bold", "Last rule value is bold");
-}
\ No newline at end of file
+}
diff --git a/toolkit/devtools/server/actors/styles.js b/toolkit/devtools/server/actors/styles.js
index 39a6da7aa2fa..6f24981867c8 100644
--- a/toolkit/devtools/server/actors/styles.js
+++ b/toolkit/devtools/server/actors/styles.js
@@ -851,7 +851,7 @@ var PageStyleActor = protocol.ActorClass({
     if (rawNode.id) {
       selector = "#" + rawNode.id;
     } else if (rawNode.className) {
-      selector = "." + rawNode.className.split(" ")[0];
+      selector = "." + rawNode.className.split(" ").join(".");
     } else {
       selector = rawNode.tagName.toLowerCase();
     }