diff --git a/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCard.tsx b/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCard.tsx
index 2c2ee17b213e..0c1fd4465655 100644
--- a/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCard.tsx
+++ b/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCard.tsx
@@ -41,8 +41,10 @@ const StyledTitleRow = styled(StyledRow)(() => ({
     alignItems: 'flex-start',
 }));
 
-const StyledBottomRow = styled(StyledRow)(() => ({
+const StyledBottomRow = styled(StyledRow)(({ theme }) => ({
     marginTop: 'auto',
+    alignItems: 'flex-end',
+    gap: theme.spacing(1),
 }));
 
 const StyledHeaderTitle = styled('h2')(({ theme }) => ({
@@ -85,6 +87,10 @@ const InfoBadgeDescription = styled('span')(({ theme }) => ({
     fontSize: theme.fontSizes.smallBody,
 }));
 
+const ProjectNameBadge = styled(Badge)({
+    wordBreak: 'break-word',
+});
+
 interface IGroupCardProps {
     group: IGroup;
     onEditUsers: (group: IGroup) => void;
@@ -150,7 +156,7 @@ export const GroupCard = ({
                                         placement='bottom-end'
                                         describeChild
                                     >
-                                        <Badge
+                                        <ProjectNameBadge
                                             onClick={(e) => {
                                                 e.preventDefault();
                                                 navigate(
@@ -161,7 +167,7 @@ export const GroupCard = ({
                                             icon={<TopicOutlinedIcon />}
                                         >
                                             {project}
-                                        </Badge>
+                                        </ProjectNameBadge>
                                     </Tooltip>
                                 ))}
                                 elseShow={