異なるCSSパディング

Question

Form Picture

私は、CSSのフォームを作成しようとしていると私の「フォーム行」セクションには、私のフィールドの残りの部分とは異なるパディングを持っています。

<div class="form-body"> 
       <div class="frm-row"> 
       <div class="section colm colm6"> 
        <label for="names" class="field-label"></label> 
        <label class="field prepend-icon"> 
         <input type="text" name="names" id="names" class="gui-input" placeholder="Name"> 
         <span class="field-icon"><i class="fa fa-user"></i></span> 
        </label> 
       <!-- end section --> 
       </div><!-- end row --> 

       <div class="section colm colm6"> 
        <label for="email" class="field-label"></label> 
        <label class="field prepend-icon"> 
         <input type="email" name="email" id="email" class="gui-input" placeholder="Email Address"> 
         <span class="field-icon"><i class="fa fa-envelope"></i></span> 
        </label> 
       </div><!-- end section --> 
       </div> 

       <div class="section"> 
        <label for="telephone" class="field-label"></label> 
        <label class="field prepend-icon"> 
         <input type="tel" name="telephone" id="telephone" class="gui-input" placeholder="Phone Number"> 
         <span class="field-icon"><i class="fa fa-phone-square"></i></span> 
        </label> 
       </div><!-- end section -->     

       <div class="section"> 
        <label for="address" class="field-label"></label> 
        <label class="field prepend-icon"> 
         <input type="address" name="address" id="autocomplete" class="gui-input" placeholder="Address"> 
         <span class="field-icon"><i class="fa fa-home"></i></span> 
        </label> 
       </div><!-- end section -->   

        <button type="submit" class="button" style="width:100%"><b>Submit</b></button> 

      </div><!-- end .form-body section --> 

私は私のスタイルシート内のいくつかの要素をターゲットにしようとしましたが、私はそれらすべてが同じ間隔を持たせるように見えることはできません。これは、行のフローティング左で問題になる可能性があります場合、私は思ったんだけど：

.frm-row .colm{min-height:0px;padding-left:10px;padding-right:10px;position:relative;float:left;} 

EDIT：

ここで私は逃したCSSの他の関連する部分は、私のミスです：

.smart-forms .section{margin-bottom:5px;} 
.smart-forms .frm-row{margin:0 -10px;} 
.smart-forms .frm-row:before, 
.smart-forms .frm-row:after{display:table;content:"";line-height:0;} 
.smart-forms .frm-row:after{clear:both;} 
.smart-forms .frm-row .colm{min-height:0px;padding-left:10px;padding-right:10px;position:relative;float:left;} 
.smart-forms .frm-row .colm6{width:50%;} 
.smart-forms .frm-row .colm{width:100%;float:none;padding:0px;} 

Answer 1

fieldiconのパディングを指定できます。これは動作します。