back and edit button spaced out properly

src/blog/components/Article/ArticleView.tsx

@@ -34,15 +34,23 @@ export default function ArticleView({
   const { currentUser } = useAuth();
   return (
     <ArticleContainer>
-      <IconButton onClick={onBack} sx={{ mb: 2 }}>
+    <Box
+      sx={{
+        display: "flex",
+        justifyContent: "space-between",
+        mb: 2,
+      }}
+    >
+      <IconButton onClick={onBack}>
         <ArrowBackRoundedIcon />
       </IconButton>
 
       {currentUser && (
-        <IconButton onClick={onEdit} sx={{ mb: 2 }}>
+        <IconButton onClick={onEdit}>
           <EditRoundedIcon />
         </IconButton>
       )}
+    </Box>
 
       <Typography variant="h3" component="h1" gutterBottom fontWeight="bold">
         {article.title}