diff --git a/.changeset/blue-planes-fail.md b/.changeset/blue-planes-fail.md
new file mode 100644
index 0000000000..ba8eca812a
--- /dev/null
+++ b/.changeset/blue-planes-fail.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+improve the wrapping behavior of long entity links
diff --git a/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx b/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx
index da299ae1e0..c1bc8c5fc0 100644
--- a/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx
+++ b/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx
@@ -15,7 +15,7 @@
  */
 
 import { Link, IconComponent } from '@backstage/core';
-import { Grid, makeStyles, Typography } from '@material-ui/core';
+import { makeStyles, Box, Typography } from '@material-ui/core';
 import LanguageIcon from '@material-ui/icons/Language';
 import React from 'react';
 
@@ -42,17 +42,17 @@ export const IconLink = ({
   const classes = useStyles();
 
   return (
-    <Grid container direction="row" spacing={1}>
-      <Grid item>
-        <Typography component="div" className={classes.svgIcon}>
+    <Box display="flex">
+      <Box mr={1} className={classes.svgIcon}>
+        <Typography component="div">
           {Icon ? <Icon /> : <LanguageIcon />}
         </Typography>
-      </Grid>
-      <Grid item>
+      </Box>
+      <Box flex>
         <Link to={href} target="_blank" rel="noopener">
           {text || href}
         </Link>
-      </Grid>
-    </Grid>
+      </Box>
+    </Box>
   );
 };