diff --git a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
index 8f3a79df3..1b2728d51 100644
--- a/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
+++ b/src/frontend/src/components/headerComponent/components/menuBar/index.tsx
@@ -99,8 +99,8 @@ export const MenuBar = ({ flows, tabId }) => {
             >
               {flows.map((flow, idx) => {
                 return (
-                  <Link to={"/flow/" + flow.id}>
-                    <DropdownMenuRadioItem value={flow.id}>
+                  <Link to={"/flow/" + flow.id} className="flex w-full items-center">
+                    <DropdownMenuRadioItem value={flow.id} className="flex-1 w-full inline-block truncate break-words mr-2">
                       {flow.name}
                     </DropdownMenuRadioItem>
                   </Link>