Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Middle (vertically) align text inside a <textarea>

Tags:

html

css

I have a multi-line search box, and I want everything aligned in the middle. Is it possible to vertically center the content of a <textarea>?

like image 536
Daniel Birowsky Popeski Avatar asked Aug 30 '25 15:08

Daniel Birowsky Popeski


1 Answers

Back in the days when i was asking this, i tried achieving this with textarea which is really not possible without scripting. The answer was adding HTML5's contenteditable="true" on a table cell with style="vertical-align: middle". If one's project allows modern HTML, this is a rather simple and effective solution.

If instead of adding <table> and <tr> and <td> to your markup, you would like something regular like a <div>, you would still need two of them:

<div style="display: table">
  <div 
    style="display: table-cell; vertical-align: middle"
    contenteditable="true">
    I am vertically aligned
  </div>
</div>
like image 100
Daniel Birowsky Popeski Avatar answered Sep 09 '25 22:09

Daniel Birowsky Popeski



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!