在文本區水平和垂直居中文本

Question

如何在textarea中水平和垂直居中文本？

HTML

<div id="visu"> 
      <div id="element1"class="flex-item"> 
       <textarea class= "name" id="name1" >Apud has gentes, quarum exordiens initium ab Assyriis </textarea> 
      </div> 
      <div id="element2" class="flex-item"> 
       <textarea class= "name" id="name2">Ultima Syriarum est Palaestina </textarea> 
      </div> 
      <div id="element3" class="flex-item"> 
       <textarea class="name" id="name3">Saepe posset commodi contentionem honoris quam incidissent optimis adipisci commod.</textarea> 
      </div> 

     </div> 

CSS #visu { 位置：絕對; 寬度：95％; left：-5ppx; top：50px; display：flex; flex-direction：row; flex-wrap：wrap; justify-content：space-around; } #visu .flex-item {position}：absolute; display：table; 寬度：30％; margin-bottom：30px; height：160px; margin-right：-20px;

 } 

     .flex-item .name { 
      display:table-cell; 
      border:3px solid blue; border-radius:10px; 
      padding:20px; box-sizing:border-box; 
      background-color:white; 
      width=150px; 
      height:180px; 
      font-size:16px; 
      text-align:center: 
      vertical-align:middle; 

     } 

Answer 1

的CSS應該是

<style> 
    #visu { 
     position:absolute; 
     width:95%; 
     left:-5ppx; 
     top:50px; 
     display:flex; 
     flex-direction:row; 
     flex-wrap:wrap; 
     justify-content:space-around; 
    } 

    #visu .flex-item { 
     /* position:absolute; */ 
     display:table; 
     width:30%; 
     margin-bottom:30px; 
     height:160px; 
     margin-right:-20px; 
    } 

    .flex-item .name { 
     display:table-cell; 
     border:3px solid blue; border-radius:10px; 
     padding:20px; box-sizing:border-box; 
     background-color:white; 
     width:150px; 
     height:180px; 
     font-size:16px; 
     text-align:center; 
     vertical-align:middle; 
    } 
</style> 

請檢查你的代碼

Answer 2

APUD有氏族，quarum exordiens initium AB Assyriis 終極Syriarum EST Palaestina Saepe posset commodi contentionem榮譽quam incidissent optimis adipisci commod。

Answer 3

#visu { 
    position:absolute; 
    width:95%; 
    left:-5ppx; 
    top:50px; 
    display:flex; 
    flex-direction:row; 
    flex-wrap:wrap; 
    justify-content:space-around; 
} 

    #visu .name { 
    /* position:absolute; */ 
    display:table; 
    width:30%; 
    margin-bottom:30px; 
    height:160px; 
    margin-right:-20px; 
} 

    #visu textarea.name { 
    display:table-cell; 
    border:3px solid blue; border-radius:10px; 
    padding:20px; box-sizing:border-box; 
    background-color:white; 
    width:150px; 
    height:180px; 
    font-size:16px; 
    text-align:center; 
    vertical-align:middle; 
}