diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
index c7f5106fce5bed..dc549a5b4f2d24 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/__snapshots__/index.test.tsx.snap
@@ -3,19 +3,25 @@
 exports[`TrustedAppsGrid renders correctly initially 1`] = `
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem"
     >
       <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+        class="euiTextAlign--center"
       >
         <div
-          class="euiText euiText--small euiTextAlign--center"
+          class="euiSpacer euiSpacer--m"
+        />
+        <div
+          class="euiText euiText--small"
         >
           No items found
         </div>
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
       </div>
     </div>
   </div>
@@ -25,7 +31,7 @@ exports[`TrustedAppsGrid renders correctly initially 1`] = `
 exports[`TrustedAppsGrid renders correctly when failed loading data for the first time 1`] = `
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem"
@@ -33,12 +39,18 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the firs
       <div
         class="euiTextAlign--center"
       >
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
         <div
           color="danger"
           data-euiicon-type="minusInCircle"
         />
          
         Intenal Server Error
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
       </div>
     </div>
   </div>
@@ -48,7 +60,7 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the firs
 exports[`TrustedAppsGrid renders correctly when failed loading data for the second time 1`] = `
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem"
@@ -56,12 +68,18 @@ exports[`TrustedAppsGrid renders correctly when failed loading data for the seco
       <div
         class="euiTextAlign--center"
       >
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
         <div
           color="danger"
           data-euiicon-type="minusInCircle"
         />
          
         Intenal Server Error
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
       </div>
     </div>
   </div>
@@ -88,11 +106,14 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
 
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div
         class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
       >
@@ -2741,6 +2762,9 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div>
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
@@ -2953,7 +2977,7 @@ exports[`TrustedAppsGrid renders correctly when loaded data 1`] = `
 exports[`TrustedAppsGrid renders correctly when loading data for the first time 1`] = `
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
@@ -2966,13 +2990,19 @@ exports[`TrustedAppsGrid renders correctly when loading data for the first time
       class="euiFlexItem"
     >
       <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+        class="euiTextAlign--center"
       >
         <div
-          class="euiText euiText--small euiTextAlign--center"
+          class="euiSpacer euiSpacer--m"
+        />
+        <div
+          class="euiText euiText--small"
         >
           No items found
         </div>
+        <div
+          class="euiSpacer euiSpacer--m"
+        />
       </div>
     </div>
   </div>
@@ -2999,7 +3029,7 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
 
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
@@ -3011,6 +3041,9 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
     <div
       class="euiFlexItem"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div
         class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
       >
@@ -5659,6 +5692,9 @@ exports[`TrustedAppsGrid renders correctly when loading data for the second time
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div>
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
@@ -5888,11 +5924,14 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
 
 <div>
   <div
-    class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
+    class="euiFlexGroup euiFlexGroup--directionColumn euiFlexGroup--responsive"
   >
     <div
       class="euiFlexItem"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div
         class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
       >
@@ -8541,6 +8580,9 @@ exports[`TrustedAppsGrid renders correctly when new page and page size set (not
     <div
       class="euiFlexItem euiFlexItem--flexGrowZero"
     >
+      <div
+        class="euiSpacer euiSpacer--l"
+      />
       <div>
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow"
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.stories.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.stories.tsx
index 0d8762111b1d02..6ebda1fad73f3d 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.stories.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.stories.tsx
@@ -8,6 +8,7 @@ import { Provider } from 'react-redux';
 import { ThemeProvider } from 'styled-components';
 import { storiesOf } from '@storybook/react';
 import euiLightVars from '@elastic/eui/dist/eui_theme_light.json';
+import { EuiHorizontalRule } from '@elastic/eui';
 
 import { KibanaContextProvider } from '../../../../../../../../../../src/plugins/kibana_react/public';
 
@@ -27,7 +28,11 @@ const renderGrid = (store: ReturnType<typeof createGlobalNoMiddlewareStore>) =>
   <Provider store={store}>
     <KibanaContextProvider services={{ uiSettings: { get: () => 'MMM D, YYYY @ HH:mm:ss.SSS' } }}>
       <ThemeProvider theme={() => ({ eui: euiLightVars, darkMode: false })}>
+        <EuiHorizontalRule margin="none" />
+
         <TrustedAppsGrid />
+
+        <EuiHorizontalRule margin="none" />
       </ThemeProvider>
     </KibanaContextProvider>
   </Provider>
diff --git a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.tsx b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.tsx
index 4664727dd848c5..d6827ba24c238e 100644
--- a/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.tsx
+++ b/x-pack/plugins/security_solution/public/management/pages/trusted_apps/view/components/trusted_apps_grid/index.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { memo, useCallback, useEffect } from 'react';
+import React, { FC, memo, useCallback, useEffect } from 'react';
 import {
   EuiTablePagination,
   EuiFlexGroup,
@@ -12,6 +12,7 @@ import {
   EuiProgress,
   EuiIcon,
   EuiText,
+  EuiSpacer,
 } from '@elastic/eui';
 
 import { Pagination } from '../../../state';
@@ -64,6 +65,14 @@ const PaginationBar = ({ pagination, onChange }: PaginationBarProps) => {
   );
 };
 
+const GridMessage: FC = ({ children }) => (
+  <div className="euiTextAlign--center">
+    <EuiSpacer size="m" />
+    {children}
+    <EuiSpacer size="m" />
+  </div>
+);
+
 export const TrustedAppsGrid = memo(() => {
   const pagination = useTrustedAppsSelector(getListPagination);
   const listItems = useTrustedAppsSelector(getListItems);
@@ -80,7 +89,7 @@ export const TrustedAppsGrid = memo(() => {
   }));
 
   return (
-    <EuiFlexGroup direction="column">
+    <EuiFlexGroup direction="column" gutterSize="none">
       {isLoading && (
         <EuiFlexItem grow={false}>
           <EuiProgress size="xs" color="primary" />
@@ -88,27 +97,33 @@ export const TrustedAppsGrid = memo(() => {
       )}
       <EuiFlexItem>
         {error && (
-          <div className="euiTextAlign--center">
+          <GridMessage>
             <EuiIcon type="minusInCircle" color="danger" /> {error}
-          </div>
+          </GridMessage>
+        )}
+        {!error && listItems.length === 0 && (
+          <GridMessage>
+            <EuiText size="s">{NO_RESULTS_MESSAGE}</EuiText>
+          </GridMessage>
         )}
-        {!error && (
-          <EuiFlexGroup direction="column">
-            {listItems.map((item) => (
-              <EuiFlexItem grow={false} key={item.id}>
-                <TrustedAppCard trustedApp={item} onDelete={handleTrustedAppDelete} />
-              </EuiFlexItem>
-            ))}
-            {listItems.length === 0 && (
-              <EuiText size="s" className="euiTextAlign--center">
-                {NO_RESULTS_MESSAGE}
-              </EuiText>
-            )}
-          </EuiFlexGroup>
+        {!error && listItems.length > 0 && (
+          <>
+            <EuiSpacer size="l" />
+
+            <EuiFlexGroup direction="column">
+              {listItems.map((item) => (
+                <EuiFlexItem grow={false} key={item.id}>
+                  <TrustedAppCard trustedApp={item} onDelete={handleTrustedAppDelete} />
+                </EuiFlexItem>
+              ))}
+            </EuiFlexGroup>
+          </>
         )}
       </EuiFlexItem>
       {!error && pagination.totalItemCount > 0 && (
         <EuiFlexItem grow={false}>
+          <EuiSpacer size="l" />
+
           <PaginationBar pagination={pagination} onChange={handlePaginationChange} />
         </EuiFlexItem>
       )}