diff --git a/src/app.js b/src/app.js
index f4eeedc..b719750 100644
--- a/src/app.js
+++ b/src/app.js
@@ -223,6 +223,10 @@ const utils = {
     el.removeAttribute('style');
     for (const prop in style) el.style[prop] = style[prop];
   },
+  initHeight(el) {
+    el.removeAttribute('style');
+    el.style.height = el.scrollHeight + 'px';
+  },
   getUniques(arr) {
     return arr.filter((item, idx) => arr.indexOf(item) === idx);
   },
diff --git a/src/pages/about/contact.html b/src/pages/about/contact.html
index b37a9bc..f5cd322 100644
--- a/src/pages/about/contact.html
+++ b/src/pages/about/contact.html
@@ -13,7 +13,7 @@ <h2 class="text-2xl font-bold">Get in touch</h2>
       rows="4"
       placeholder="Leave a message..."
       x-ref="textarea"
-      @input="$el.removeAttribute('style'); $el.style.height = `${$el.scrollHeight}px`; $el.value = $el.value.replaceAll('  ', ' ').replaceAll('\n\n\n', '\n\n');"
+      @input="initHeight($el); $el.value = $el.value.replaceAll('  ', ' ').replaceAll('\n\n\n', '\n\n');"
     ></textarea>
     <div class="p-3 flex items-center justify-end gap-2">
       <button