diff --git a/web/app/(dashboard)/layout-client.tsx b/web/app/(dashboard)/layout-client.tsx
index 606c47c7..1bbc205b 100644
--- a/web/app/(dashboard)/layout-client.tsx
+++ b/web/app/(dashboard)/layout-client.tsx
@@ -119,10 +119,16 @@ function DashboardHeader({
 					>
 						<User className="size-4" />
 					</DropdownMenuTrigger>
-					<DropdownMenuContent align="end" sideOffset={8}>
+					<DropdownMenuContent
+						align="end"
+						sideOffset={8}
+						className="w-40"
+					>
 						<DropdownMenuGroup>
 							<DropdownMenuLabel>
-								<span className="block font-medium">{name}</span>
+								<span className="block truncate text-sm font-semibold">
+									{name}
+								</span>
 								<span className="block truncate text-xs font-normal text-muted-foreground">
 									{email}
 								</span>
diff --git a/web/components/server/server-services.tsx b/web/components/server/server-services.tsx
index ac75e0bb..1b1240fb 100644
--- a/web/components/server/server-services.tsx
+++ b/web/components/server/server-services.tsx
@@ -34,11 +34,11 @@ export async function ServerServices({ serverId }: { serverId: string }) {
 				<div className="space-y-5">
 					{groups.map((group) => (
 						<div key={group.key} className="space-y-2">
-							<div>
+							<div className="flex items-center gap-2">
 								<p className="font-medium text-sm">{group.projectName}</p>
-								<p className="text-xs text-muted-foreground">
+								<span className="text-xs text-muted-foreground">
 									{group.environmentName}
-								</p>
+								</span>
 							</div>
 							<div className="divide-y rounded-lg border">
 								{group.services.map((service) => (