diff --git a/app/src/components/HintPart.vue b/app/src/components/HintPart.vue
index 8107806..0cdad51 100644
--- a/app/src/components/HintPart.vue
+++ b/app/src/components/HintPart.vue
@@ -55,12 +55,10 @@ const right = () => {
       </button>
     </div>
   </div>
-  <div id="hint" class="bg-bg flex flex-wrap">
-    <div class="bg-bg h-full rounded-lg p-8 m-1">
-      <p class="inline text-text font-xl font-xl">
-        {{ sessionManager.hints.value[current] }}
-      </p>
-      <br />
-    </div>
+  <div id="hint" class="bg-bg flex flex-wrap p-8">
+    <p class="text-text font-xl whitespace-pre-wrap">
+      {{ sessionManager.hints.value[current] }}
+    </p>
+    <br />
   </div>
 </template>
diff --git a/app/src/components/QuestPart.vue b/app/src/components/QuestPart.vue
index 5a8359f..d65609c 100644
--- a/app/src/components/QuestPart.vue
+++ b/app/src/components/QuestPart.vue
@@ -26,7 +26,7 @@ onMounted(async () => {
     </h1>
     <hr class="border-text-tertiary border-2 my-2" />
     <div>
-      <div v-if="questData" class="whitespace-pre-line">
+      <div v-if="questData" class="whitespace-pre-wrap">
         <p class="text-text">{{ questData.instruction }}</p>
         <br />
         <p class="text-text">Tasks:</p>