CSS

Jackson Monk
Jackson Monk
4,476 Points
Posted by Jackson Monk
Jackson Monk
4,476 Points

How to get text to go to top

I have an HTML input field whose height I extended to be complimentary to the page, but when typing, the text still appears in the center of the box rather than at the top of its enlarged state. I want to know how I can get it to the top, like it is in the box this question was written in, or in the answer box below.

2 Answers

Jackson Monk
Jackson Monk
4,476 Points
Jackson Monk
Jackson Monk
4,476 Points

This is the piece of code, I think it will help

#rant-input {
   float: left;
   height: 150px;
   width: 1350px;
   border-radius: 5px;
}

<input type = text id = rant-input>
Steven Parker
Steven Parker
145,868 Points
Steven Parker
Steven Parker
145,868 Points

As the MDN documentation page says: "<input> elements of type text create basic, single-line inputs."

For multi-line input the <textarea> element would be a better choice, and the input in it aligns to the top by default:

<textarea id="rant-input"></textarea>
Jackson Monk
Jackson Monk
4,476 Points
Jackson Monk
Jackson Monk
4,476 Points

Youve saved me yet again Steven, thanks.