在html div元素中的對齊問題

Question

我有一個html表單，它使用bootstrap進行了樣式化。 一個字段有對齊問題。 我嘗試過不同的事情，但它似乎並沒有鍛鍊。

的代碼如下對於相關區域：

<div class="row"> 
    <div class="col-md-8"> 
     <div class="box"> 
      <div class="box-body"> 
       <div class="form-group"> 
       <label for="email">E-Mail</label> 
       <input type="email" class="form-control" id="email" name="email" 
         value="<?php echo(!empty($action_array['data'][0]['email']) ? $action_array['data'][0]['email'] : "") ?>" 
         placeholder="Enter E-Mail" maxlength="255"> 
      </div> 
      <div class="form-group required"> 
       <label for="lAddress" class="control-label">Address</label> 
       <input type="text" class="form-control" id="lAddress" name="lAddress" 
         value="<?php echo(!empty($action_array['data'][0]['address']) ? $action_array['data'][0]['address'] : "") ?>" 
         placeholder="Enter Personnel Address" maxlength="250" required> 
      </div> 

      <div class="form-group"> 

       <label for="lAddress" class="control-label">Similar Names</label> 

       <div class="box-body"> 
        <div class="form-group"> 
         <label for="similar-name-select" class="sr-only">Similar Names</label> 

         <div class="col-md-12"> 
          <select name="similarNames[]" id="similar-name-select" 
            class="form-control select2" 
            data-placeholder="Enter similar names" multiple="multiple" 
            style="width: 100%"> 

           <?php 
           if (!empty($similar_names_arr)) { 
            foreach ($similar_names_arr as $similar_name) { 
             echo('<option value="' . $similar_name . '" selected="selected">' . $similar_name . '</option>'); 
            } 
           } 
           ?> 
          </select> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

the issue is displayed in here

Answer 1

您有內聯表單組，你有多個標籤，請嘗試：

<div class="col-md-8"> 
    <div class="box"> 
     <div class="box-body"> 
       <div class="form-group"> 
       <label for="email">E-Mail</label> 
       <input type="email" class="form-control" id="email" name="email" 
         value="<?php echo(!empty($action_array['data'][0]['email']) ? $action_array['data'][0]['email'] : "") ?>" 
         placeholder="Enter E-Mail" maxlength="255"> 
      </div> 
      <div class="form-group required"> 
       <label for="lAddress" class="control-label">Address</label> 
       <input type="text" class="form-control" id="lAddress" name="lAddress" 
         value="<?php echo(!empty($action_array['data'][0]['address']) ? $action_array['data'][0]['address'] : "") ?>" 
         placeholder="Enter Personnel Address" maxlength="250" required> 
      </div> 

      <div class="form-group"> 
      <label for="similar-name-select">Similar Names</label> 

       <select name="similarNames[]" id="similar-name-select" 
         class="form-control select2" 
         data-placeholder="Enter similar names" multiple="multiple" 
         style="width: 100%"> 

        <?php 
        if (!empty($similar_names_arr)) { 
         foreach ($similar_names_arr as $similar_name) { 
          echo('<option value="' . $similar_name . '" selected="selected">' . $similar_name . '</option>'); 
         } 
        } 
        ?> 


       </select> 
      </div> 
     </div> 
    </div> 

</div> 

演示： https://jsfiddle.net/DTcHh/38467/