Vertical Algin Textarea

Question

嗨我有一个页面内的文本框，我需要水平和垂直对齐中间。我一直在尝试“显示表”方法，但无济于事。

问题是，当我设置表格行时，我的文本框放弃了我设置的所有格式，并缩小到最小尺寸，它也粘贴到页面的左侧。

任何帮助非常感谢！

<div id="outer"> 
    <div class="inner">       
      <textarea id="text" ></textarea>       
    </div> 
</div> 

CSS

#outer{ 
    display:table-row; 
    height:230px; 
} 

#inner{ 
    display:table-cell; 
    vertical-align:middle; 
} 

#text{ 
    background:#e9e9e9; 
    padding:10px; 
    resize: none; 
    font-size: 10px; 
    color: #000; 
    height: 100px; 
    width: 95%; 
} 

Answer 1

尝试使用显示：上在内的div外层的div和表单元格的表格。

jsFiddle example（境加入到看对齐）

#outer { 
    height:230px; 
    border:1px solid #999; 
    display:table; 
    width:100%; 
} 
.inner { 
    display:table-cell; 
    vertical-align:middle; 
    text-align:center; 
} 
#text { 
    background:#e9e9e9; 
    padding:10px; 
    resize: none; 
    font-size: 10px; 
    color: #000; 
    height: 100px; 
    width: 95%; 
} 

Answer 2

既然你已经宣布你想为中心，您可以使用绝对定心元素的高度，说明here。只需添加一个

text-align: center 

添加水平居中。