CODEWITHSUNDEEP
htmlcss
d.mc2
d.mc2

Reputation: 1129

Vertically Center TextArea Text

I was wondering about the textarea box bit.ly has on the 1st page you log in where they state to "Shorten your links and share from here".

I was wondering how you would go about centering text in a textarea? I don't think there's a command, so how would you hardcode move it down a few spaces. You can't use html tags in the textarea so it's been difficult with

or other methods

Upvotes: 0

Views: 3105

Answers (2)

Lime
Lime

Reputation: 13569

Set textarea padding and margin 0 and set the line-height. Or it would be better to use padding like Kerrek posted

You can't center multi line text in a textarea but you can add padding.

<!doctype html>
<style>
input[type=text]{margin:0;padding:0;line-height:40px;font-size:40px;}
</style>
<input type=text>

Upvotes: 0

Kerrek SB
Kerrek SB

Reputation: 477040

Are you sure it's a textarea and not just an <input type="text">? If it's the latter, you can achieve the effect quite easily with padding:

input[type=text] { font-size: 20px; padding: 5px; }

Edit: If it's a text area (say with one row), styling via padding works the same:

textarea { font-size: 20px; padding: 5px; }

Upvotes: 2

Related Questions