diff --git a/src/components/CircularProgressbar/index.js b/src/components/CircularProgressbar/index.js
index c347843..f4e8eec 100644
--- a/src/components/CircularProgressbar/index.js
+++ b/src/components/CircularProgressbar/index.js
@@ -13,7 +13,7 @@ function CustomCircularProgressbar() {
       <div style={{ width: 200, height: 200 }}>
         <CircularProgressbar value={percentage} text={`${percentage}%`} />
       </div>
-      <div style={{ width: 200, height: 200, marginTop : 20 }}>
+      <div className="" style={{ width: 200, height: 200, marginTop: 20 }}>
         <CircularProgressbarWithChildren
           value={80}
           styles={buildStyles({
diff --git a/src/components/Comments/index.js b/src/components/Comments/index.js
index 0314108..d7f3d06 100644
--- a/src/components/Comments/index.js
+++ b/src/components/Comments/index.js
@@ -6,20 +6,20 @@ import positiveIcon from "./positive.svg";
 import negativeIcon from "./negative.svg";
 import Avatar from "../Avatar";
 import moment from "jalali-moment";
-import Button from '../Button';
+import Button from "../Button";
 
 export const Comments = ({ comments }) => {
   // connectToParent(comments);
   const Comment = ({ comment }) => {
     return (
-      <div className="flex flex-col w-full">
+      <div className=" w-full flex flex-col">
         <header className="w-full flex flex-row justify-between py-1">
           <div className="flex flex-row items-end">
             <Avatar source={comment.userImage} size={60} rounded={true} />
             <div className="flex flex-col">
-              <strong className="text-lg mr-2">{comment.username}</strong>
+              <strong className="mr-2 text-lg">{comment.username}</strong>
               <div
-                className="flex flex-row divide-x divide-gray-300 divided items-center"
+                className="flex flex-row items-center divided divide-x divide-gray-300 "
                 style={{ direction: "ltr" }}
               >
                 <span className="px-2 text-xs text-gray-500">