I want to center the placeholder text for my textareas. The code below works fine in Chrome and IE, but is left-aligned in Safari:
::-webkit-inp
I made a simple solution that works on Safari 5+ and all other browser you can check it at: http://jsfiddle.net/joaorito/RqUJL
HTML
-
Maecenas sed diam eget risus varius blandit sit amet non magna.
CSS
.center_area
{
font-size: 16px;
width: 300px;
height: 300px;
border: 5px solid black;
}
.center_area ul
{
margin: 0;
padding: 0;
list-style: none;
background-color: red;
height: 100%;
width: 100%;
}
.center_area ul li
{
color: #FFF;
font-size: 1.500em;
line-height: 28px;
}
.center_area ul li div
{
background-color: green;
padding: 10px;
text-align: center;
}
.center_area .V_align
{
display: table;
overflow: hidden;
}
.center_area .V_align .V_cell
{
display: table-cell;
vertical-align: middle;
width: 100%;
margin: 0 auto;
}
.center_area .V_align .V_cell .V_element
{
display: block;
}