CSS Text Input field not aligning top left?

Question

I'm trying to have an Input Text Field display the text on the top left, right now the text is centered vertically and horizontally in the middle.

<input class="userInput" type="text">
<style>
.userInput {
text-align: left;
margin: 1px;
padding: 1px;
width: 500px;
height: 300px;
vertical-align: top;
}
</style>

Answer 1

Text inputs are for single line input. I would suggest using <textarea> instead.

Example: https://jsfiddle.net/z58vy354/