diff --git a/src/components/Search/SearchInput.tsx b/src/components/Search/SearchInput.tsx
index f92c31644..15da18922 100644
--- a/src/components/Search/SearchInput.tsx
+++ b/src/components/Search/SearchInput.tsx
@@ -225,7 +225,7 @@ const SearchInput = ({ onStateChange }: SearchInputListener) => {
                     className="pf-v5-u-mb-xs"
                     component={(props) => <ChromeLink {...props} href={item.pathname} />}
                   >
-                    <SearchTitle title={item.title} bundleTitle={item.bundleTitle.replace(/(\[|\])/gm, '')} />
+                    <SearchTitle title={item.title} bundleTitle={item.bundleTitle.replace(/(\[|\])/gm, '')} className="pf-v5-u-mb-xs" />
                     <SearchDescription description={item.description} />
                   </MenuItem>
                 ))}
diff --git a/src/components/Search/SearchTitle.scss b/src/components/Search/SearchTitle.scss
new file mode 100644
index 000000000..85031e25c
--- /dev/null
+++ b/src/components/Search/SearchTitle.scss
@@ -0,0 +1,4 @@
+.chr-search-title-content small {
+  // Value stolen from Patternfly TextContent, but the appropriate variable isn't available here.
+  font-size: 0.875rem;
+}
diff --git a/src/components/Search/SearchTitle.tsx b/src/components/Search/SearchTitle.tsx
index 7d67965df..810a56987 100644
--- a/src/components/Search/SearchTitle.tsx
+++ b/src/components/Search/SearchTitle.tsx
@@ -1,18 +1,21 @@
 import React from 'react';
-import { Text, TextContent } from '@patternfly/react-core/dist/dynamic/components/Text';
+import './SearchTitle.scss';
 
-const SearchTitle = ({ title, bundleTitle }: { title: string; bundleTitle: string }) => {
+const SearchTitle = ({ title, bundleTitle, className = '' }: { title: string; bundleTitle: string; className?: string }) => {
   const showBundleTitle = bundleTitle.replace(/\s/g, '').length > 0;
   return (
-    <TextContent>
-      <Text component="small" className="pf-v5-u-link-color chr-c-search-title" dangerouslySetInnerHTML={{ __html: title }}></Text>
-      {showBundleTitle && (
-        <Text component="small" className="pf-v5-u-link-color">
-          <span className="pf-v5-u-px-sm">|</span>
-        </Text>
-      )}
-      {showBundleTitle && <Text component="small" className="pf-v5-u-link-color" dangerouslySetInnerHTML={{ __html: bundleTitle }}></Text>}
-    </TextContent>
+    <div className={`chr-search-title-content pf-v5-u-link-color ${className}`}>
+      <small className="pf-v5-u-link-color chr-c-search-title">
+        <span className="chr-c-search-title" dangerouslySetInnerHTML={{ __html: title }} />
+
+        {showBundleTitle && (
+          <>
+            <span className="pf-v5-u-px-sm">|</span>
+            <span dangerouslySetInnerHTML={{ __html: bundleTitle }} />
+          </>
+        )}
+      </small>
+    </div>
   );
 };