glyphicons bootstrap 图标与 textarea 不对齐答案

【问题标题】：glyphicons bootstrap icon not align with textareaglyphicons bootstrap 图标与 textarea 不对齐
【发布时间】：2017-06-20 11:37:01
【问题描述】：

glyphicons 图标高于 textarea 输入。

<div class="form-group">
<div class="col-md-8 inputGroupContainer">
    <label class="label-margin" for="name"><span class="label-required">* 
  </span>Message</label>
        <div class="input-group"><span class="input-group-addon"><i 
   class="glyphicon glyphicon-align-left" ></i></span>
            <textarea class="message" cols="35" id="message" name="message" 
  rows="8"></textarea>
        </div>
    </div>
  </div>

【问题讨论】：

标签： css twitter-bootstrap glyphicons

【解决方案1】：

只需将 form-control 类添加到 textarea，如下所示

<div class="form-group">
<div class="col-md-8 inputGroupContainer">
    <label class="label-margin" for="name"><span class="label-required">* 
  </span>Message</label>
        <div class="input-group"><span class="input-group-addon"><i 
   class="glyphicon glyphicon-align-left" ></i></span>
            <textarea class="message form-control" cols="35" id="message" name="message" 
  rows="8"></textarea>
        </div>
    </div>
  </div>

工作小提琴

fiddle link

【讨论】：

它有效。我错过了表单控件。 @Lokesh Gupta tq。但是 select2 下拉菜单怎么样？
你可以使用相同的类或创建一个小提琴，这样我可以更好地理解
好的，我会创建的。但还有一个我想删除标签，只需将星号放在字段之前
所以在form-group中使用col-md-4并将asterisk 放在div中