2017-06-20 81 views
0

glyphicons圖標比textarea輸入更高興。glyphicons bootstrap圖標不與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> 

enter image description here

回答

0

只需添加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

+0

它的工作原理。我錯過了表格控制。 @Lokesh Gupta tq。但是select2下拉菜單怎麼樣? – styles

+0

你可以使用相同的類或創建一個小提琴,所以我可以更好地理解 – LKG

+0

https://jsfiddle.net/ocs69ss5/10/你可以克里特像小提琴 – LKG