Form fields have space in them - php

Question

My form fields have space in them, if I select and delete this space my prefilled text shows back up. I don't know what to make of this and have been trouble shooting all day. Any ideas? Here is my code...
<?php
include '_include/php/header.php';
#set variables to be used in the header
$page_title = "Assesment";
?>
<div class="page" id="subheader">
<div class="container">
<!-- Title Page -->
<div class="row">
<div class="span12">
<div class="title-page">
<h2 class="title">Four simple steps...</h2>
<h3 class="title-description">To dictate what you need
in a website</h3>
</div>
</div>
</div><!-- End Title Page -->
<!-- submenu -->
<?php
include '_include/php/submenu.php'; ?>
</div>
</div><!-- End sub header -->
<!-- main Section -->
<div class="page" id="contact">
<div class="container">
<!-- Title Page -->
<div class="row">
<div class="span12">
<div class="title-page">
<h2 class="title">Assesment - Step One</h2>
<h3 class="title-description">Status: <span class=
"color-text"><?php echo $assessresult; ?></span></h3>
</div>
</div>
</div><!-- End Title Page -->
<!-- main Form -->
<div class="row">
<div class="span9">
<form action="assessment_submitted.php" class="contact-form" id="contact-form"
method="post" name="contact-form">
<h3 class="color-text">What do you wish to get out of
your website?</h3>
<p class="contact-message">
<textarea required cols="10" id="client-goals" name=
"client-goals" placeholder=
"What do you wish to acheive by having a website? ie. creating a web presence, expanding sales by creating an online market, networking, ect."
rows="5">
</textarea></p>
<h3 class="color-text">What key fatures are you looking
for?</h3>
<p class="contact-message">
<textarea required cols="10" id="client-needs" name=
"client-needs" placeholder=
"What key features are you looking to have within your website? ie. storefront, social media intigrtion, a blogging platform, content managment system, ect."
rows="5">
</textarea></p>
<script type = "text/javascript" >
var i = 1;
function addUrl() {
if (i < 3) {
i++;
var p = document.createElement('p');
p.innerHTML =
'<hr><textarea required id="client-needs" placeholder="Add URL #' + i +
'" name="example' + i +
'" rows="1" cols="10"><\/textarea><input type="button" value="Remove added URL" onclick="removeUrl(this)">';
document.getElementById('example').appendChild(p);
} //END if
} //END addUrl function
function removeUrl(textarea) {
textarea.parentNode.parentNode.removeChild(textarea.parentNode);
i--;
} //END removeUrl function
</script>
<h3 class="color-text">Do you have and examples of what
you want?</h3>
<p class="contact-message" id="example">
<textarea cols="10" id="examples" name="example1"
placeholder="Do you know of any website like the one you want? ie. google.com, p5services.com, youtube.com"
rows="1">
</textarea></p><br>
<input onclick="addUrl()" type="button" value=
"Add url example">
<h3 class="color-text">Do you have a budget in
mind?</h3>
<p class="contact-message">
<textarea required cols="10" id="client-budget" name=
"client-budget" placeholder=
"Enter a budget, approximate or exact. This will help us decide if the scope of your project is in line with what you are interested in spending"
rows="2">
</textarea></p>
<h3 class="color-text">Do you have a timeline or
deadline?</h3>
<p class="contact-message">
<!-- <textarea id="client-deadline" placeholder="When do you need this done by?" name="client-deadline" rows="2" cols="10"></textarea> -->
<!-- <input id="client-deadline" name="client-deadline"
type="date"></p> -->
<!-- add a call to action for further services later -->
<h3 class="color-text">Any other comments?</h3>
<p class="contact-message">
<textarea cols="10" id="client-comments" name=
"client-comments" placeholder=
"Don't let us over look anything!" rows="5">
</textarea></p>
<p class="contact-submit"><input name=
"submit_assessment" type="submit" value=
"Save New Record"></p>
<div id="response"></div>
</form>
</div>
<div class="span3">
<div class="contact-details">
<h3><span class="font-icon-info"></span> Assesment
Objective</h3>
<p>The assesment section is used to define your needs
and help us decided what tool we need to impliment in
order to help you reach your goals</p>
<h4 class="color-text">After submitting this you will
recive a quote!</h4>
</div>
</div>
</div><!-- End main Form -->
</div>
</div><!-- End main Section -->
<?php
include '_include/php/footer.php'; ?>

Answer 1

The textarea element takes placeholder text in a different form. You need to put it between the tags like so:
<textarea>My text area placeholder text goes here</textarea>
The space that you are seeing then deleting to see your placeholder is caused by the line break between your opening and closing textarea tags