Menu icon Foundation
Textarea isn't a text area F6

I'm migrating from F5 to F6, and am updating a form on the site using the transparent building block, which has worked fine on another form on the site. 

Whenever I use the input textarea, it is displaying as a tiny box, instead of the expandable box (also when not using the transparent building block). 

Here's my code: 

<div class="column row">
       
<form action="../../email.php" method="post" class="custom" id="contact_form" data-abide novalidate>
<div data-abide-error class="alert callout" style="display: none;">
<p><i class="fi-alert"></i>&nbsp;Please correct the errors on your form</p></div>
<div class="row">
<div class="large-12 columns">
<label>Name</label>    
<input type="text" placeholder="Your name" id="name" name="name" required><span class="form-error">Please provide your name</span></div></div>
<div class="row">
<div class="large-6 medium-6 columns">
<label>Email</label>
<input type="email" placeholder="[email protected]" id="email" name="email" required><span class="form-error">Please provide your email address</span>
</div>
<div class="large-6 medium-6 columns">
<label>Telephone</label>
<input type="text" placeholder="Telephone" id="telephone" name="telephone" required><span class="form-error">Please provide your telephone number</span></div></div>
                    
<div class="row">
<div class="large-12 columns"><label>Your message</label>
<input type="textarea" rows="12" placeholder="Type your message here" id="comments" name="comments" required><span class="form-error">Please enter your message for Britannia Bradshaw</span></div></div>
<div class="row"><div class="large-12 small-12 columns">
<button type="submit" class="primary button expanded search-button"><h5>Call me back</button></div></div></form></div>

 

 

 

Do you see anything I'm missing here? 

 

Many thanks!! 

 

textareaformsF6

I'm migrating from F5 to F6, and am updating a form on the site using the transparent building block, which has worked fine on another form on the site. 

Whenever I use the input textarea, it is displaying as a tiny box, instead of the expandable box (also when not using the transparent building block). 

Here's my code: 

<div class="column row">
       
<form action="../../email.php" method="post" class="custom" id="contact_form" data-abide novalidate>
<div data-abide-error class="alert callout" style="display: none;">
<p><i class="fi-alert"></i>&nbsp;Please correct the errors on your form</p></div>
<div class="row">
<div class="large-12 columns">
<label>Name</label>    
<input type="text" placeholder="Your name" id="name" name="name" required><span class="form-error">Please provide your name</span></div></div>
<div class="row">
<div class="large-6 medium-6 columns">
<label>Email</label>
<input type="email" placeholder="[email protected]" id="email" name="email" required><span class="form-error">Please provide your email address</span>
</div>
<div class="large-6 medium-6 columns">
<label>Telephone</label>
<input type="text" placeholder="Telephone" id="telephone" name="telephone" required><span class="form-error">Please provide your telephone number</span></div></div>
                    
<div class="row">
<div class="large-12 columns"><label>Your message</label>
<input type="textarea" rows="12" placeholder="Type your message here" id="comments" name="comments" required><span class="form-error">Please enter your message for Britannia Bradshaw</span></div></div>
<div class="row"><div class="large-12 small-12 columns">
<button type="submit" class="primary button expanded search-button"><h5>Call me back</button></div></div></form></div>

 

 

 

Do you see anything I'm missing here? 

 

Many thanks!! 

 

This post has been closed. No new replies can be added.

Rafi Benkual over 2 years ago

 I could be totally wrong but there is no such thing as input type textarea right?
It should be <textarea> example: http://codepen.io/rafibomb/pen/wdrBRq?editors=1000

Shelley over 2 years ago

Sometimes it is the glaringly obvious stuff - many, many thanks!!