从引导元素对齐文本字段和文本区域

我不知道如何对齐我的文本字段和我的文本区域。有高度从引导元素对齐文本字段和文本区域

enter image description here

稍有差异正如你可以在图片中看到。电话号码文本字段延伸超过了文本区域的高度。我的HTML中有Ruby on Rails语法，但要应用类，只需在class:中添加类名即可。我的HTML使用twitter bootstrap提供的所有css。我试图改变行，但它往往延长太远

HTML：

<%= form_for(:contact, remote: true, class: "contact-input") do |f| %> 
    <div class="col-md-12"> 
    <div class="col-md-6"> 
     <div class="form-group"> 
     <%= f.text_field(:first_name, class: "form-control", placeholder: "First name")%> 
     </div> 
     <div class="form-group"> 
     <%= f.text_field(:last_name, class: "form-control", placeholder: "Last name") %> 
     </div> 
     <div class="form-group"> 
     <%= f.email_field(:email, class: "form-control", placeholder: "Email") %> 
     </div> 
     <div class="form-group"> 
     <%= f.telephone_field(:phone_number, class: "form-control", placeholder: "Phone number") %> 
     </div> 
    </div> 
    <div class="col-md-6"> 
     <div class="form-group"> 
     <%= f.text_area(:message, class: "form-control", rows: "8", placeholder: "Message...") %> 
     </div> 
    </div> 
    </div> 
    <%= f.submit(class: "btn btn-xl") %> 
<% end %>

来源

2014-11-25 Liondancer

为文本区的高度取决于行数。

因此，这可以通过减少文字的边缘进行使用自定义CSS类

.newMargin{ 
    margin-bottom:13px !important; 
}

检查fiddle

域一点点

来源

2014-11-25 02:33:36 VSri58

从引导元素对齐文本字段和文本区域

回答

相关问题