diff --git a/ui/src/playlist/PlaylistDetails.jsx b/ui/src/playlist/PlaylistDetails.jsx
index 87ca1154..aead252c 100644
--- a/ui/src/playlist/PlaylistDetails.jsx
+++ b/ui/src/playlist/PlaylistDetails.jsx
@@ -69,9 +69,14 @@ const useStyles = makeStyles(
       opacity: 0.5,
     },
     title: {
-      whiteSpace: 'nowrap',
       overflow: 'hidden',
       textOverflow: 'ellipsis',
+      wordBreak: 'break-word',
+    },
+    stats: {
+      marginTop: '1em',
+      marginBottom: '0.5em',
+      display: 'inline-block',
     },
   }),
   {
@@ -143,7 +148,7 @@ const PlaylistDetails = (props) => {
             >
               {record.name || translate('ra.page.loading')}
             </Typography>
-            <Typography component="p">
+            <Typography component="p" className={classes.stats}>
               {record.songCount ? (
                 <span>
                   {record.songCount}{' '}