BASIC Modify Textarea

I feel so stupid.

I’m styling the contact form layout for my website.

I cannot figure out how to increase the size of the field “Textarea.”

Nothing I do in the design interface seems to do anything at all.

Assistance greatly appreciated.

Here is my site Read-Only: https://preview.webflow.com/preview/droneguycda?utm_medium=preview_link&utm_source=designer&utm_content=droneguycda&preview=e71cdc4ef1046b1821ae2f537406036a&pageId=61561e3574b235d1d2eee476&workflow=preview

Hi @jw83876, thanks for your post, this can be done by setting a min height to your form textarea element.

See this post for more details: Why can't I set the size of my text area? (SOLVED) - #4 by Matty

I hope this helps.

Hi @jw83876 standard way to set basic textarea dimension is to add rows and/or cols attribute. WF doesn’t for some reason allow add this attribute in their attribute field and give us warning that rows is reserved word.

But you can simply do that with JS setAttribute.

  1. grab your textarea element
  2. assign custom attribute
  3. prevent textarea resizing functionality (Optional)
<script>
const textArea = document.querySelector(".your_textarea_class")
// OR => const textArea = document.querySelector("#your_textarea_id")
textArea.setAttribute("rows", 20)
</script>

<style>
<!-- when using class selector -->
.your_textarea_class{
  resize: none;
}
<style>

just use one of possible ways to form your text area that suit to your project. both are valid :wink:

1 Like

Thank you both very much. Problem solved. :grinning:

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.