diff --git a/src/client/recent/RecentPage.tsx b/src/client/recent/RecentPage.tsx
index b0619091..f5171271 100644
--- a/src/client/recent/RecentPage.tsx
+++ b/src/client/recent/RecentPage.tsx
@@ -54,7 +54,7 @@ const recent = () => {
         setIndex(index);
     },[copy, setIndex]);
 
-    const baseClass = ['float-right'];
+    const baseClass = ['mr-3'];
 
     const isUpstream = searchParams.get('upstream') === '1';
 
@@ -93,8 +93,11 @@ const recent = () => {
                         //     }
                         //     return y;
                         // });
-                        return <li key={x.index}><PlayDisplay data={x} buildOptions={displayOpts}/> <button className={clsx(classes)} onClick={() => copyActionCB(x.meta.lifecycle, x.index)}>{copiedIndex === x.index ? 'Copied!' : <FontAwesomeIcon
-                        color="white" icon={faBug}/>}</button></li>
+                        return <li key={x.index}>
+                            <button className={clsx(classes)} onClick={() => copyActionCB(x.meta.lifecycle, x.index)}>{copiedIndex === x.index ? 'Copied!' : <FontAwesomeIcon
+                        color="white" icon={faBug}/>}</button>
+                            <PlayDisplay data={x} buildOptions={displayOpts}/>
+                        </li>
                 })}</ul>
                 </div>
             </div>
diff --git a/src/client/scrobbled/ScrobbledPage.tsx b/src/client/scrobbled/ScrobbledPage.tsx
index 2e259f48..b65c45b7 100644
--- a/src/client/scrobbled/ScrobbledPage.tsx
+++ b/src/client/scrobbled/ScrobbledPage.tsx
@@ -31,7 +31,7 @@ const scrobbled = () => {
         setIndex(index);
     },[copy, setIndex]);
 
-    const baseClass = ['float-right'];
+    const baseClass = ['mr-3'];
 
 
     return (
@@ -46,8 +46,11 @@ const scrobbled = () => {
                     <ul>{data.map(x => {
                         const classes = [...baseClass].concat(copiedIndex !== x.index ? ['underline','cursor-pointer'] : []);
                         
-                        return <li key={x.index}><PlayDisplay data={x} buildOptions={displayOpts}/> <button className={clsx(classes)} onClick={() => copyActionCB(x.meta.lifecycle, x.index)}>{copiedIndex === x.index ? 'Copied!' : <FontAwesomeIcon
-                                                color="white" icon={faBug}/>}</button></li>;
+                        return <li key={x.index}>
+                            <button className={clsx(classes)} onClick={() => copyActionCB(x.meta.lifecycle, x.index)}>{copiedIndex === x.index ? 'Copied!' : <FontAwesomeIcon
+                                                color="white" icon={faBug}/>}</button>
+                                                <PlayDisplay data={x} buildOptions={displayOpts}/>
+                                </li>;
                 })} </ul>
                 </div>
             </div>