diff --git a/changelog/+menu.fixed.md b/changelog/+menu.fixed.md
new file mode 100644
index 0000000000..4e265ddf82
--- /dev/null
+++ b/changelog/+menu.fixed.md
@@ -0,0 +1,2 @@
+- Fixed issue causing a gap in menu sidebar when text is too long.
+- Prevent avatar from being cut off in menu sidebar.
diff --git a/frontend/app/src/shared/components/account-menu.tsx b/frontend/app/src/shared/components/account-menu.tsx
index 86d865e597..810c1a6621 100644
--- a/frontend/app/src/shared/components/account-menu.tsx
+++ b/frontend/app/src/shared/components/account-menu.tsx
@@ -172,7 +172,7 @@ const AuthenticatedAccountMenu = ({
       <DropdownMenuTrigger asChild>
         <Button
           variant="ghost"
-          className="h-auto w-full justify-start gap-2 hover:bg-indigo-50 rounded-lg p-2 overflow-hidden text-left"
+          className="h-auto w-full justify-start gap-2 hover:bg-indigo-50 rounded-lg p-2 overflow-hidden text-left shrink-0"
           data-testid="authenticated-menu-trigger"
         >
           <Avatar name={profile?.name?.value} className="h-10 w-10 shrink-0" />
diff --git a/frontend/app/src/shared/components/layout/menu-navigation/components/menu-section-object.tsx b/frontend/app/src/shared/components/layout/menu-navigation/components/menu-section-object.tsx
index b8f68f1dee..7253e3c6b3 100644
--- a/frontend/app/src/shared/components/layout/menu-navigation/components/menu-section-object.tsx
+++ b/frontend/app/src/shared/components/layout/menu-navigation/components/menu-section-object.tsx
@@ -87,7 +87,10 @@ const TopLevelMenuItem: React.FC<{
 }> = ({ item, isCollapsed }) => {
   if (!item.children?.length) {
     return (
-      <Link to={constructPath(item.path)} className={menuNavigationItemStyle}>
+      <Link
+        to={constructPath(item.path)}
+        className={classNames(menuNavigationItemStyle, "w-[224px]")}
+      >
         <MenuItemIcon item={item} />
         <span className={classNames("text-sm", isCollapsed && "hidden")}>{item.label}</span>
       </Link>
@@ -96,7 +99,9 @@ const TopLevelMenuItem: React.FC<{
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger className={classNames(menuNavigationItemStyle, isCollapsed && "p-2")}>
+      <DropdownMenuTrigger
+        className={classNames(menuNavigationItemStyle, isCollapsed ? "p-2" : "w-[224px]")}
+      >
         <Tooltip enabled={isCollapsed} content={item.label} side="right">
           <span className="flex">
             <MenuItemIcon item={item} />
@@ -123,10 +128,8 @@ const TopLevelMenuItem: React.FC<{
   );
 };
 
-export const MenuSectionObject: React.FC<MenuSectionObjectsProps> = ({ isCollapsed, items }) => (
-  <div className="flex flex-col w-full overflow-auto">
-    {items.map((item) => (
-      <TopLevelMenuItem key={item.identifier} item={item} isCollapsed={isCollapsed} />
-    ))}
-  </div>
-);
+export const MenuSectionObject: React.FC<MenuSectionObjectsProps> = ({ isCollapsed, items }) => {
+  return items.map((item) => (
+    <TopLevelMenuItem key={item.identifier} item={item} isCollapsed={isCollapsed} />
+  ));
+};