diff --git a/awx/ui_next/src/screens/Host/HostAdd/HostAdd.jsx b/awx/ui_next/src/screens/Host/HostAdd/HostAdd.jsx
index 122ce7dd27..e6de69f823 100644
--- a/awx/ui_next/src/screens/Host/HostAdd/HostAdd.jsx
+++ b/awx/ui_next/src/screens/Host/HostAdd/HostAdd.jsx
@@ -3,6 +3,7 @@ import { useHistory } from 'react-router-dom';
 import { CardBody } from '@components/Card';
 import HostForm from '@components/HostForm';
 import { HostsAPI } from '@api';
+import { PageSection, Card } from '@patternfly/react-core';
 
 function HostAdd() {
   const [formError, setFormError] = useState(null);
@@ -22,13 +23,17 @@ function HostAdd() {
   };
 
   return (
-    <CardBody>
-      <HostForm
-        handleSubmit={handleSubmit}
-        handleCancel={handleCancel}
-        submitError={formError}
-      />
-    </CardBody>
+    <PageSection>
+      <Card>
+        <CardBody>
+          <HostForm
+            handleSubmit={handleSubmit}
+            handleCancel={handleCancel}
+            submitError={formError}
+          />
+        </CardBody>
+      </Card>
+    </PageSection>
   );
 }