--- a/devtools/client/inspector/fonts/components/FontOverview.js
+++ b/devtools/client/inspector/fonts/components/FontOverview.js
@@ -41,31 +41,33 @@ class FontOverview extends PureComponent
       onPreviewFonts,
       onToggleFontHighlight,
     } = this.props;
     const { fonts } = fontData;
 
     // If the font editor is enabled, show the fonts in a collapsed accordion.
     // The editor already displays fonts, in another way, rendering twice is not desired.
     if (Services.prefs.getBoolPref(PREF_FONT_EDITOR)) {
-      return Accordion({
+      return fonts.length ? Accordion({
         items: [
           {
             header: getStr("fontinspector.renderedFontsInPageHeader"),
             component: FontList,
             componentProps: {
               fonts,
               fontOptions,
               onPreviewFonts,
               onToggleFontHighlight,
             },
             opened: false
           }
         ]
-      });
+      })
+      :
+      null;
     }
 
     return fonts.length ?
       FontList({
         fonts,
         fontOptions,
         onPreviewFonts,
         onToggleFontHighlight,

--- a/devtools/client/themes/fonts.css
+++ b/devtools/client/themes/fonts.css
@@ -339,11 +339,15 @@
   background: url(chrome://devtools/skin/images/copy.svg) no-repeat;
   background-size: 12px;
   background-position-x: -1px;
   -moz-context-properties: fill;
   fill: var(--theme-toolbar-color);
 
 }
 
-#font-container .devtools-sidepanel-no-result + .accordion {
-  border-block-start: 1px solid var(--theme-splitter-color);
+#font-container .accordion {
+  border-top: 1px solid var(--theme-splitter-color);
 }
+
+#font-container .accordion + .accordion {
+  border-top: none;
+}