diff --git a/src/app/(app)/playground/@problem/@description/components/footer.tsx b/src/app/(app)/playground/@problem/@description/components/footer.tsx
index c980eb9..68ba1e3 100644
--- a/src/app/(app)/playground/@problem/@description/components/footer.tsx
+++ b/src/app/(app)/playground/@problem/@description/components/footer.tsx
@@ -14,7 +14,9 @@ export default function ProblemDescriptionFooter({
       className={cn("h-9 flex flex-none items-center bg-muted", className)}
     >
       <div className="w-full flex items-center justify-center">
-        Description of Two Sum
+        <span className="truncate">
+          Description of Two Sum
+        </span>
       </div>
     </footer>
   );
diff --git a/src/app/(app)/playground/@problem/@solution/components/footer.tsx b/src/app/(app)/playground/@problem/@solution/components/footer.tsx
index bac1e73..9f1e8f1 100644
--- a/src/app/(app)/playground/@problem/@solution/components/footer.tsx
+++ b/src/app/(app)/playground/@problem/@solution/components/footer.tsx
@@ -14,7 +14,9 @@ export default function ProblemSolutionFooter({
       className={cn("h-9 flex flex-none items-center bg-muted", className)}
     >
       <div className="w-full flex items-center justify-center">
-        Solution of Two Sum
+        <span className="truncate">
+          Solution of Two Sum
+        </span>
       </div>
     </footer>
   );
diff --git a/src/app/(app)/playground/@workspace/@editor/components/footer.tsx b/src/app/(app)/playground/@workspace/@editor/components/footer.tsx
index e5fb567..e69ff4b 100644
--- a/src/app/(app)/playground/@workspace/@editor/components/footer.tsx
+++ b/src/app/(app)/playground/@workspace/@editor/components/footer.tsx
@@ -42,9 +42,11 @@ export default function WorkspaceEditorFooter({
       className={cn("h-9 flex flex-none items-center bg-muted px-3 py-2", className)}
     >
       <div className="w-full flex items-center justify-end">
-        {position
-          ? `Row ${position.lineNumber}, Column ${position.column}`
-          : "Row -, Column -"}
+        <span className="truncate">
+          {position
+            ? `Row ${position.lineNumber}, Column ${position.column}`
+            : "Row -, Column -"}
+        </span>
       </div>
     </footer>
   );