textarea标签垂直对齐：中间 [英] textarea label vertical-align: middle

问题描述

我正在尝试在文本框的中间对齐此文本区域的标签，但是它不起作用。输出看起来像这样： b $ b

这是我一直在尝试的代码。

 < style> 
标签textarea {
 vertical-align：middle; 
} 
< / style> 
 
< label>简介：< textarea style = border：none rows = 7 cols = 60> $ v_Synopsis< / textarea>< / label> 
  

解决方案

CODEPEN演示

HTML

 < div> 
< label for = textarea> Textarea：< / label> 
< textarea cols = 40行= 8 name = textarea id = textarea>< / textarea> 
< / div> 
  

CSS

  label，
 textarea {
 display：inline-block; 
 vertical-align：middle; 
 
} 
  

I'm trying to align the label for this text area in the middle of the text box, but it just isn't working. The output looks something like this:

          xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx      
          xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
          xxxxxxxxxxxxxxxxxxxxxxxxxxxxx    
Synopsis: xxxxxxxxxxxxxxxxxxxxxxxxxxxx

Here's the code I've been trying. TY!

<style>
label textarea{
 vertical-align: middle;
}
</style>

<label>Synopsis: <textarea style="border: none" rows="7" cols="60">$v_Synopsis</textarea></label> 

解决方案

CODEPEN DEMO

HTML

 <div>
  <label for="textarea">Textarea:</label>
  <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
</div>

CSS

label,
textarea{
  display:inline-block;
  vertical-align:middle;

}

这篇关于textarea标签垂直对齐：中间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！