带有图标引导程序的Textarea未正确对齐

Question

我正在创建类似于以下内容的引导程序联系表单：http://amitpatil.me/demos/twitter-bootstrap-ajax-contact-form/contact.php

到目前为止，我的身体还有这个：

<div class="container">

    <form role="form" style="width:400px; margin: 0 auto;">
        <h1>Contact us</h1>

        <div class="form-group required-field-block">                
            <div class="col-md-12 input-group">
                <span class="input-group-addon"><span class="glyphicon glyphicon-info-sign"></span></span>
                <input type="text" size="30" value="" class="form-control" placeholder="Podjetje">
                <div class="required-icon">
                    <div class="text">*</div>
                </div>                  
            </div>
        </div>

        <div class="form-group required-field-block">       
            <div class="col-md-12 input-group">
                <div class="col-sm-1 column">
                    <span class="input-group-addon"><span class="glyphicon glyphicon-pencil"></span></span>
                </div>
                <div class="col-sm-11 column">
                    <textarea rows="3" size="30" value="" class="form-control" placeholder="Sporočilo"></textarea>  
                    <div class="required-icon">
                        <div class="text">*</div>
                    </div>
                </div>
            </div>
        </div>

        <button class="btn btn-primary razmik_mail">Pošlji</button>

    </form>

但是这样做了：

你可以看到我的＆＃34; Textarea＆＃34;未正确对齐。图标应该在下方（信息图标）和完整图标，如你所见，它有剪切图标，我不知道为什么。而且textarea应该输入，并且更长时间（就像在链接中一样）。

所以我的目标是创建像这样的textarea：

任何想法，我错在哪里？真的感谢您的帮助。

以下是演示：http://jsfiddle.net/tutpgtdo/5/

Answer 1

你的textarea周围有额外的列HTML，删除它应该没问题，所以它应该是这样的：

<div class="form-group required-field-block">       
        <div class="col-md-12 input-group">
            <span class="input-group-addon"><span class="glyphicon glyphicon-pencil"></span></span>
            <textarea rows="3" size="30" value="" class="form-control" placeholder="Sporočilo"></textarea>  
                <div class="required-icon">
                    <div class="text">*</div>
                </div>
        </div>
    </div>