diff --git a/resources/scripts/components/admin/api/ApiKeysContainer.tsx b/resources/scripts/components/admin/api/ApiKeysContainer.tsx
index a4496c26..0a8f51ed 100644
--- a/resources/scripts/components/admin/api/ApiKeysContainer.tsx
+++ b/resources/scripts/components/admin/api/ApiKeysContainer.tsx
@@ -7,12 +7,14 @@ export default () => {
     return (
         <AdminContentBlock title={'API Keys'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>API Keys</h2>
-                    <p css={tw`text-base text-neutral-400`}>Control access credentials for managing this Panel via the API.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Control access credentials for managing this Panel via the API.</p>
                 </div>
 
-                <NewApiKeyButton />
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NewApiKeyButton />
+                </div>
             </div>
         </AdminContentBlock>
     );
diff --git a/resources/scripts/components/admin/api/NewApiKeyButton.tsx b/resources/scripts/components/admin/api/NewApiKeyButton.tsx
index 0e8d4ad3..b387f21c 100644
--- a/resources/scripts/components/admin/api/NewApiKeyButton.tsx
+++ b/resources/scripts/components/admin/api/NewApiKeyButton.tsx
@@ -165,7 +165,7 @@ export default () => {
                 }
             </Formik>
 
-            <Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`} onClick={() => setVisible(true)}>
+            <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`} onClick={() => setVisible(true)}>
                 New API Key
             </Button>
         </>
diff --git a/resources/scripts/components/admin/databases/DatabaseEditContainer.tsx b/resources/scripts/components/admin/databases/DatabaseEditContainer.tsx
index 7450bc6b..c4092b0a 100644
--- a/resources/scripts/components/admin/databases/DatabaseEditContainer.tsx
+++ b/resources/scripts/components/admin/databases/DatabaseEditContainer.tsx
@@ -197,9 +197,9 @@ const DatabaseEditContainer = () => {
     return (
         <AdminContentBlock title={'Database - ' + database.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{database.name}</h2>
-                    <p css={tw`text-base text-neutral-400`}>{database.getAddress()}</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{database.getAddress()}</p>
                 </div>
             </div>
 
diff --git a/resources/scripts/components/admin/databases/DatabasesContainer.tsx b/resources/scripts/components/admin/databases/DatabasesContainer.tsx
index acf34297..f993614c 100644
--- a/resources/scripts/components/admin/databases/DatabasesContainer.tsx
+++ b/resources/scripts/components/admin/databases/DatabasesContainer.tsx
@@ -63,16 +63,18 @@ const DatabasesContainer = () => {
     return (
         <AdminContentBlock title={'Databases'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Database Hosts</h2>
-                    <p css={tw`text-base text-neutral-400`}>Database hosts that servers can have databases created on.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Database hosts that servers can have databases created on.</p>
                 </div>
 
-                <NavLink to={`${match.url}/new`} css={tw`ml-auto`}>
-                    <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0`}>
-                        New Database Host
-                    </Button>
-                </NavLink>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NavLink to={`${match.url}/new`}>
+                        <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
+                            New Database Host
+                        </Button>
+                    </NavLink>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'databases'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/databases/NewDatabaseContainer.tsx b/resources/scripts/components/admin/databases/NewDatabaseContainer.tsx
index 1316b941..875ee9d2 100644
--- a/resources/scripts/components/admin/databases/NewDatabaseContainer.tsx
+++ b/resources/scripts/components/admin/databases/NewDatabaseContainer.tsx
@@ -4,11 +4,11 @@ import AdminContentBlock from '@/components/admin/AdminContentBlock';
 
 export default () => {
     return (
-        <AdminContentBlock>
+        <AdminContentBlock title={'New Database'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Create Database Host</h2>
-                    <p css={tw`text-base text-neutral-400`}>Add a new database host to the panel.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Add a new database host to the panel.</p>
                 </div>
             </div>
         </AdminContentBlock>
diff --git a/resources/scripts/components/admin/locations/LocationEditContainer.tsx b/resources/scripts/components/admin/locations/LocationEditContainer.tsx
index c41def2e..869bc0c1 100644
--- a/resources/scripts/components/admin/locations/LocationEditContainer.tsx
+++ b/resources/scripts/components/admin/locations/LocationEditContainer.tsx
@@ -157,7 +157,7 @@ const LocationEditContainer = () => {
     return (
         <AdminContentBlock title={'Location - ' + location.short}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{location.short}</h2>
                     {
                         (location.long || '').length < 1 ?
@@ -165,7 +165,7 @@ const LocationEditContainer = () => {
                                 <span css={tw`italic`}>No long name</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{location.long}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{location.long}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/locations/LocationsContainer.tsx b/resources/scripts/components/admin/locations/LocationsContainer.tsx
index af37bc32..00b91c68 100644
--- a/resources/scripts/components/admin/locations/LocationsContainer.tsx
+++ b/resources/scripts/components/admin/locations/LocationsContainer.tsx
@@ -63,12 +63,14 @@ const LocationsContainer = () => {
     return (
         <AdminContentBlock title={'Locations'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Locations</h2>
-                    <p css={tw`text-base text-neutral-400`}>All locations that nodes can be assigned to for easier categorization.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All locations that nodes can be assigned to for easier categorization.</p>
                 </div>
 
-                <NewLocationButton/>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NewLocationButton/>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'locations'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/locations/NewLocationButton.tsx b/resources/scripts/components/admin/locations/NewLocationButton.tsx
index 8ed4aab0..6bccc2f6 100644
--- a/resources/scripts/components/admin/locations/NewLocationButton.tsx
+++ b/resources/scripts/components/admin/locations/NewLocationButton.tsx
@@ -103,7 +103,7 @@ export default () => {
                 }
             </Formik>
 
-            <Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`} onClick={() => setVisible(true)}>
+            <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`} onClick={() => setVisible(true)}>
                 New Location
             </Button>
         </>
diff --git a/resources/scripts/components/admin/mounts/MountEditContainer.tsx b/resources/scripts/components/admin/mounts/MountEditContainer.tsx
index d0b3ad1d..d2b39cd6 100644
--- a/resources/scripts/components/admin/mounts/MountEditContainer.tsx
+++ b/resources/scripts/components/admin/mounts/MountEditContainer.tsx
@@ -187,7 +187,7 @@ const MountEditContainer = () => {
     return (
         <AdminContentBlock title={'Mount - ' + mount.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{mount.name}</h2>
                     {
                         (mount.description || '').length < 1 ?
@@ -195,7 +195,7 @@ const MountEditContainer = () => {
                                 <span css={tw`italic`}>No description</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{mount.description}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{mount.description}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/mounts/MountsContainer.tsx b/resources/scripts/components/admin/mounts/MountsContainer.tsx
index b78b9728..10f95f03 100644
--- a/resources/scripts/components/admin/mounts/MountsContainer.tsx
+++ b/resources/scripts/components/admin/mounts/MountsContainer.tsx
@@ -63,14 +63,16 @@ const MountsContainer = () => {
     return (
         <AdminContentBlock title={'Mounts'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Mounts</h2>
-                    <p css={tw`text-base text-neutral-400`}>Configure and manage additional mount points for servers.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Configure and manage additional mount points for servers.</p>
                 </div>
 
-                <Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`}>
-                    New Mount
-                </Button>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
+                        New Mount
+                    </Button>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'mounts'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/nests/NestEditContainer.tsx b/resources/scripts/components/admin/nests/NestEditContainer.tsx
index 4802fed4..6fcbd5d4 100644
--- a/resources/scripts/components/admin/nests/NestEditContainer.tsx
+++ b/resources/scripts/components/admin/nests/NestEditContainer.tsx
@@ -262,7 +262,7 @@ const NestEditContainer = () => {
     return (
         <AdminContentBlock title={'Nests - ' + nest.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{nest.name}</h2>
                     {
                         (nest.description || '').length < 1 ?
@@ -270,7 +270,7 @@ const NestEditContainer = () => {
                                 <span css={tw`italic`}>No description</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{nest.description}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{nest.description}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/nests/NestsContainer.tsx b/resources/scripts/components/admin/nests/NestsContainer.tsx
index 3baa14d9..6696ced2 100644
--- a/resources/scripts/components/admin/nests/NestsContainer.tsx
+++ b/resources/scripts/components/admin/nests/NestsContainer.tsx
@@ -63,12 +63,14 @@ const NestsContainer = () => {
     return (
         <AdminContentBlock title={'Nests'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Nests</h2>
-                    <p css={tw`text-base text-neutral-400`}>All nests currently available on this system.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All nests currently available on this system.</p>
                 </div>
 
-                <NewNestButton/>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NewNestButton/>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'nests'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/nests/NewNestButton.tsx b/resources/scripts/components/admin/nests/NewNestButton.tsx
index 55eec655..57656c44 100644
--- a/resources/scripts/components/admin/nests/NewNestButton.tsx
+++ b/resources/scripts/components/admin/nests/NewNestButton.tsx
@@ -103,7 +103,7 @@ export default () => {
                 }
             </Formik>
 
-            <Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`} onClick={() => setVisible(true)}>
+            <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`} onClick={() => setVisible(true)}>
                 New Nest
             </Button>
         </>
diff --git a/resources/scripts/components/admin/nests/eggs/EggEditContainer.tsx b/resources/scripts/components/admin/nests/eggs/EggEditContainer.tsx
index f7e231f5..54fb6e88 100644
--- a/resources/scripts/components/admin/nests/eggs/EggEditContainer.tsx
+++ b/resources/scripts/components/admin/nests/eggs/EggEditContainer.tsx
@@ -57,7 +57,7 @@ const EggEditContainer = () => {
     return (
         <AdminContentBlock title={'Egg - ' + egg.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{egg.name}</h2>
                     {
                         (egg.description || '').length < 1 ?
@@ -65,7 +65,7 @@ const EggEditContainer = () => {
                                 <span css={tw`italic`}>No description</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{egg.description}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{egg.description}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/nodes/NewNodeContainer.tsx b/resources/scripts/components/admin/nodes/NewNodeContainer.tsx
index a0c145d1..2376bc48 100644
--- a/resources/scripts/components/admin/nodes/NewNodeContainer.tsx
+++ b/resources/scripts/components/admin/nodes/NewNodeContainer.tsx
@@ -4,11 +4,11 @@ import AdminContentBlock from '@/components/admin/AdminContentBlock';
 
 export default () => {
     return (
-        <AdminContentBlock>
+        <AdminContentBlock title={'New Node'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Create Node</h2>
-                    <p css={tw`text-base text-neutral-400`}>Add a new node to the panel.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Add a new node to the panel.</p>
                 </div>
             </div>
         </AdminContentBlock>
diff --git a/resources/scripts/components/admin/nodes/NodeEditContainer.tsx b/resources/scripts/components/admin/nodes/NodeEditContainer.tsx
index 756e32eb..b4e4227d 100644
--- a/resources/scripts/components/admin/nodes/NodeEditContainer.tsx
+++ b/resources/scripts/components/admin/nodes/NodeEditContainer.tsx
@@ -58,9 +58,9 @@ const NodeEditContainer = () => {
     return (
         <AdminContentBlock title={'Node - ' + node.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{node.name}</h2>
-                    <p css={tw`text-base text-neutral-400`}>{node.uuid}</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{node.uuid}</p>
                 </div>
             </div>
 
diff --git a/resources/scripts/components/admin/nodes/NodesContainer.tsx b/resources/scripts/components/admin/nodes/NodesContainer.tsx
index 11fc70a9..41db23b1 100644
--- a/resources/scripts/components/admin/nodes/NodesContainer.tsx
+++ b/resources/scripts/components/admin/nodes/NodesContainer.tsx
@@ -64,16 +64,18 @@ const NodesContainer = () => {
     return (
         <AdminContentBlock title={'Nodes'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Nodes</h2>
-                    <p css={tw`text-base text-neutral-400`}>All nodes available on the system.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All nodes available on the system.</p>
                 </div>
 
-                <NavLink to={`${match.url}/new`} css={tw`ml-auto`}>
-                    <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0`}>
-                        New Node
-                    </Button>
-                </NavLink>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NavLink to={`${match.url}/new`}>
+                        <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
+                            New Node
+                        </Button>
+                    </NavLink>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'nodes'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/overview/OverviewContainer.tsx b/resources/scripts/components/admin/overview/OverviewContainer.tsx
index 623c120e..2de5acc9 100644
--- a/resources/scripts/components/admin/overview/OverviewContainer.tsx
+++ b/resources/scripts/components/admin/overview/OverviewContainer.tsx
@@ -33,9 +33,11 @@ export default () => {
 
     return (
         <AdminContentBlock title={'Overview'}>
-            <div css={tw`flex flex-col mb-8`}>
-                <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Overview</h2>
-                <p css={tw`text-base text-neutral-400`}>A quick glance at your system.</p>
+            <div css={tw`w-full flex flex-row items-center mb-8`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
+                    <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Overview</h2>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>A quick glance at your system.</p>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'overview'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/roles/NewRoleButton.tsx b/resources/scripts/components/admin/roles/NewRoleButton.tsx
index 5259dfe0..f57bdefd 100644
--- a/resources/scripts/components/admin/roles/NewRoleButton.tsx
+++ b/resources/scripts/components/admin/roles/NewRoleButton.tsx
@@ -102,7 +102,7 @@ export default () => {
                 }
             </Formik>
 
-            <Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`} onClick={() => setVisible(true)}>
+            <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`} onClick={() => setVisible(true)}>
                 New Role
             </Button>
         </>
diff --git a/resources/scripts/components/admin/roles/RoleEditContainer.tsx b/resources/scripts/components/admin/roles/RoleEditContainer.tsx
index 7d5ef9ed..3cb1ea24 100644
--- a/resources/scripts/components/admin/roles/RoleEditContainer.tsx
+++ b/resources/scripts/components/admin/roles/RoleEditContainer.tsx
@@ -58,7 +58,7 @@ const RoleEditContainer = () => {
     return (
         <AdminContentBlock title={'Role - ' + role.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{role.name}</h2>
                     {
                         (role.description || '').length < 1 ?
@@ -66,7 +66,7 @@ const RoleEditContainer = () => {
                                 <span css={tw`italic`}>No description</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{role.description}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{role.description}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/roles/RolesContainer.tsx b/resources/scripts/components/admin/roles/RolesContainer.tsx
index 41066dfb..7519ffb2 100644
--- a/resources/scripts/components/admin/roles/RolesContainer.tsx
+++ b/resources/scripts/components/admin/roles/RolesContainer.tsx
@@ -64,12 +64,14 @@ export default () => {
     return (
         <AdminContentBlock title={'Roles'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Roles</h2>
-                    <p css={tw`text-base text-neutral-400`}>Soon&trade;</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Soon&trade;</p>
                 </div>
 
-                <NewRoleButton/>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NewRoleButton/>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'roles'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/servers/NewServerContainer.tsx b/resources/scripts/components/admin/servers/NewServerContainer.tsx
index bf6f7416..75aae7ee 100644
--- a/resources/scripts/components/admin/servers/NewServerContainer.tsx
+++ b/resources/scripts/components/admin/servers/NewServerContainer.tsx
@@ -4,11 +4,11 @@ import AdminContentBlock from '@/components/admin/AdminContentBlock';
 
 export default () => {
     return (
-        <AdminContentBlock>
+        <AdminContentBlock title={'New Server'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Create Server</h2>
-                    <p css={tw`text-base text-neutral-400`}>Add a new server to the panel.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Add a new server to the panel.</p>
                 </div>
             </div>
         </AdminContentBlock>
diff --git a/resources/scripts/components/admin/servers/ServerEditContainer.tsx b/resources/scripts/components/admin/servers/ServerEditContainer.tsx
index 6af94987..8fcdc9b2 100644
--- a/resources/scripts/components/admin/servers/ServerEditContainer.tsx
+++ b/resources/scripts/components/admin/servers/ServerEditContainer.tsx
@@ -58,7 +58,7 @@ const ServerEditContainer = () => {
     return (
         <AdminContentBlock title={'Server - ' + server.name}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{server.name}</h2>
                     {
                         (server.description || '').length < 1 ?
@@ -66,7 +66,7 @@ const ServerEditContainer = () => {
                                 <span css={tw`italic`}>No description</span>
                             </p>
                             :
-                            <p css={tw`text-base text-neutral-400`}>{server.description}</p>
+                            <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{server.description}</p>
                     }
                 </div>
             </div>
diff --git a/resources/scripts/components/admin/servers/ServersContainer.tsx b/resources/scripts/components/admin/servers/ServersContainer.tsx
index 3fbb21b7..d87a33bf 100644
--- a/resources/scripts/components/admin/servers/ServersContainer.tsx
+++ b/resources/scripts/components/admin/servers/ServersContainer.tsx
@@ -63,16 +63,18 @@ const UsersContainer = () => {
     return (
         <AdminContentBlock title={'Servers'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Servers</h2>
-                    <p css={tw`text-base text-neutral-400`}>All servers available on the system.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All servers available on the system.</p>
                 </div>
 
-                <NavLink to={`${match.url}/new`} css={tw`ml-auto`}>
-                    <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0`}>
-                        New Server
-                    </Button>
-                </NavLink>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NavLink to={`${match.url}/new`}>
+                        <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
+                            New Server
+                        </Button>
+                    </NavLink>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'servers'} css={tw`mb-4`}/>
diff --git a/resources/scripts/components/admin/settings/SettingsContainer.tsx b/resources/scripts/components/admin/settings/SettingsContainer.tsx
index 62990a3e..3e2fc206 100644
--- a/resources/scripts/components/admin/settings/SettingsContainer.tsx
+++ b/resources/scripts/components/admin/settings/SettingsContainer.tsx
@@ -5,9 +5,11 @@ import AdminContentBlock from '@/components/admin/AdminContentBlock';
 export default () => {
     return (
         <AdminContentBlock title={'Settings'}>
-            <div>
-                <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Settings</h2>
-                <p css={tw`text-base text-neutral-400`}>Configure and manage settings for Pterodactyl.</p>
+            <div css={tw`w-full flex flex-row items-center mb-8`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
+                    <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Settings</h2>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Configure and manage settings for Pterodactyl.</p>
+                </div>
             </div>
         </AdminContentBlock>
     );
diff --git a/resources/scripts/components/admin/users/NewUserContainer.tsx b/resources/scripts/components/admin/users/NewUserContainer.tsx
index f4b10afc..19a64e9d 100644
--- a/resources/scripts/components/admin/users/NewUserContainer.tsx
+++ b/resources/scripts/components/admin/users/NewUserContainer.tsx
@@ -4,11 +4,11 @@ import AdminContentBlock from '@/components/admin/AdminContentBlock';
 
 export default () => {
     return (
-        <AdminContentBlock>
+        <AdminContentBlock title={'New User'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Create User</h2>
-                    <p css={tw`text-base text-neutral-400`}>Add a new user to the panel.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Add a new user to the panel.</p>
                 </div>
             </div>
         </AdminContentBlock>
diff --git a/resources/scripts/components/admin/users/UserEditContainer.tsx b/resources/scripts/components/admin/users/UserEditContainer.tsx
index 8b8bf068..b7cf17c4 100644
--- a/resources/scripts/components/admin/users/UserEditContainer.tsx
+++ b/resources/scripts/components/admin/users/UserEditContainer.tsx
@@ -58,9 +58,9 @@ const UserEditContainer = () => {
     return (
         <AdminContentBlock title={'User - ' + user.id}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{user.firstName} {user.lastName}</h2>
-                    <p css={tw`text-base text-neutral-400`}>{user.email}</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{user.email}</p>
                 </div>
             </div>
 
diff --git a/resources/scripts/components/admin/users/UsersContainer.tsx b/resources/scripts/components/admin/users/UsersContainer.tsx
index 7c83960b..b0502385 100644
--- a/resources/scripts/components/admin/users/UsersContainer.tsx
+++ b/resources/scripts/components/admin/users/UsersContainer.tsx
@@ -63,16 +63,18 @@ const UsersContainer = () => {
     return (
         <AdminContentBlock title={'Users'}>
             <div css={tw`w-full flex flex-row items-center mb-8`}>
-                <div css={tw`flex flex-col`}>
+                <div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
                     <h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Users</h2>
-                    <p css={tw`text-base text-neutral-400`}>All registered users on the system.</p>
+                    <p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All registered users on the system.</p>
                 </div>
 
-                <NavLink to={`${match.url}/new`} css={tw`ml-auto`}>
-                    <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0`}>
-                        New User
-                    </Button>
-                </NavLink>
+                <div css={tw`flex ml-auto pl-4`}>
+                    <NavLink to={`${match.url}/new`}>
+                        <Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
+                            New User
+                        </Button>
+                    </NavLink>
+                </div>
             </div>
 
             <FlashMessageRender byKey={'users'} css={tw`mb-4`}/>