I want to centre the text inside a text area; I am trying with the line height, but it doesn't work.
How do I align text in the middle of textarea? The answer was adding HTML5's contenteditable="true" on a table cell with style="vertical-align: middle".
Use the line-height property to make the placeholder vertically centered.
For vertical alignment, set the parent element's width / height to 100% and add display: table . Then for the child element, change the display to table-cell and add vertical-align: middle . For horizontal centering, you could either add text-align: center to center the text and any other inline children elements.
To center a div vertically on a page, you can use the CSS position property, top property, and transform property. Start by setting the position of the div to absolute so that it's taken out of the normal document flow. Then set the top property to 50%.
You could use the contenteditable="true"
attribute on a <div>
and then skin it with CSS.
Here is a link for cross browser compatibility: Reliable cross-browser info on ContentEditable
You can use padding only to achieve that, but it's not pretty way to do things. You can also use jQuery to make the padding flexible, instead of just setting it by yourself.
Hey now you can used input tag
Replace textarea into input tag as like this
and define height
and line-height
Css
input[type="text"]{
line-height:125px;
height:125px;
}
HTML
<input type="text" value="">
Live demo http://jsfiddle.net/MTCrt/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With