i have form in footer , contact page of clients website, simple reason form text area box not move on line when reaches end of box, keeps scrolling. site live here
the client wants able create new paragraphs , content box resize according amount of content input.
i have played around ages can't seem find wrong. maybe i'm missing obvious...
my forms code this, php code above
<h1 style="color:#00b3ff" id="contact-form">contact us</h1> <?php if( !$success ): ?> <p style="color:#ffffff;">fill out form below , respond asap.</p> <form class="quick" method="post" action="#contact-form"> <input type="text" name="contact[name]" class="text-field" value="<?php echo $_post['contact']['name']; ?>" placeholder="name *" /> <input type="text" name="contact[email]" class="text-field" value="<?php echo $_post['contact']['email']; ?>" placeholder="email" /> <input type="text" name="contact[telephone]" class="text-field" value="<?php echo $_post['contact']['telephone']; ?>" placeholder="telephone *" /> <input type="text" name="contact[comments]" class="textarea" value="<?php echo $_post['contact']['comments']; ?>" placeholder="comments *" /> <input type="submit" value="submit" name="submit" class="submit" /> <?php else: ?> <p style="color: white;">thank enquiry, we'll shortly.</p> <?php endif; ?> </form> /* login & register form */ form.quick{ height: auto; width: 100%; font-family: 'open sans', sans-serif; } i cant see here wrong?
form .text-field { float: left; border: 0px solid #a6a6a6; width: 70%; height: 45px; border-radius: 2px; margin-top: 10px; padding-left: 10px; color: #000000; background: #fcfcfc; outline: none; } form .text-field:focus { box-shadow: inset 0 0 2px #008dd3; color: #a6a6a6; background: white; } form .textarea { float: left; border: 0px solid #a6a6a6; width: 70%; height: 45px; border-radius: 2px; margin-top: 10px; padding-left: 10px; color: #000000; background: #fcfcfc; outline: none; } form .textarea:focus { box-shadow: inset 0 0 2px #00b3ff; background: white; } form .submit { -webkit-appearance: none; border-radius: 2px; border: 0px solid #336895; width: 40%; height: 40px; margin-top: 10px; background-color: #00b3ff; cursor: pointer; color: white; font-family: 'open sans', sans-serif; font-size: 14px; font-weight:400; opacity: 1; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; } form .submit:hover { opacity: 0.8; } could me please i'm pulling hair out on this!
change
<input type="text" name="contact[comments]" class="textarea" value="<?php echo $_post['contact']['comments']; ?>" placeholder="comments *" /> to
<textarea name="contact[comments]" class="textarea" placeholder="comments *"><?php echo $_post['contact']['comments']; ?></textarea> 
Comments
Post a Comment