Setting height on form and placeholder break - html

Question

I would like to set the height on this form-group. The problem is that the placeholder can't be more wide that it is now, and therefore I have to make it higher. As it is now the placeholder text is going horizontal out, and I would like the placeholder text continued under the line vertically instead.
Is that possible at all?
<div class="form-group">
<label class="sr-only" for="udfordring">Største udfordring</label>
<input type="text" class="form-control" id="udfordring" name="udfordring" placeholder="This is a long text there cannot be in the normal field" style="height:300px;"/>
</div>

Answer 1

CSS
.navbar .navbar-form
{
padding-top: 0;
padding-bottom: 0;
margin-right: 0;
margin-left: 0;
border: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
HTML
<div class="panel panel-primary shadow">
<div class="panel-heading">SUBSCRIBE FOR NEWSLETTER OF WHOLE 10</div> <!-- id-2 for the subscribe channel-->
<div class="panel-body">
<form>
<div class="form group">
<label for="input e-mail">EMAIL</label>
<input type="email" class="form-control" id="inputEmail" placeholder="email">
</div>
<div class="form group">
<label for="input e-mail">USERNAME</label>
<input type="email" class="form-control" id="inputEmail" placeholder="username">
</div>
<br>
<div class="checkbox">
<label><input type="checkbox">REMEMBER ME</label>
</div>
<button type="submit" class="btn btn-primary">LOGIN</button>
</form>`enter code here`
</div>
</div>