2016-09-18 9 views
1

Wie kann ich diese zwei divs vertikal ausrichten? Egal welche Art von Spaltengröße ich habe, die zwei Eingabegruppen werden nicht auf der vertikalen Linie ausgerichtet. pls check the image here.Wie kann ich zwei Formulargruppen-Div-Aligns vertikal ausrichten?

Hier ist mein Code-Schnipsel:

<div class="widget-body"> 
    <form class="form-horizontal" id="form"> 
     <input class="form-control" type="hidden" id="id"> 
     <fieldset> 
      <div class="form-group col-md-6"> 
       <label class="col-md-4 control-label"> fax</label> 
       <div class="col-md-8"> 
        <input class="form-control" type="text" id="name" name="name"> 
       </div> 
      </div> 
      <div class="form-group col-md-6"> 
       <label class="col-md-4 control-label"> email</label> 
       <div class="col-md-8"> 
        <input class="form-control" type="text" id="name" name="name"> 
       </div> 
      </div> 
      <div class="form-group col-md-6"> 
       <label class="col-md-4 control-label"> QQ</label> 
       <div class="col-md-8"> 
        <input class="form-control" type="text" id="name" name="name"> 
       </div> 
      </div> 
      <div class="form-group col-md-6"> 
       <label class="col-md-4 control-label"> wechat</label> 
       <div class="col-md-8"> 
        <input class="form-control" type="text" id="name" name="name"> 
       </div> 
      </div> 
      <div class="form-group col-md-12"> 
       <label class="col-md-2 control-label"> remark</label> 
       <div class="col-md-10 pull-left"> 
        <textarea class="form-control" type="text" id="name" name="name"></textarea> 
       </div> 
      </div> 
     </fieldset> 
    </form> 
</div> 
+1

Dies ist kein Javascript Problem. Was CSS hast du probiert? Sie werden Ihre Frage-Tags so aktualisieren müssen, dass sie "css" enthalten und welches Framework auch immer das ist. –

+0

Ich habe die Antwort hinzugefügt, die Sie erwartet haben – Gowtham

+0

Ahh hat es .... lassen Sie mich meine Frage aktualisieren. –

Antwort

0

Bootstrap hat eine Standard-Polsterung auf der col-xx-xx, die Sie verwenden .. so col-md-6 verwendet zweimal mehr Polsterung haben als col -md-12 einmal verwendet .. Sie können das Padding anpassen, indem Sie einfach einen zusätzlichen Inline-Stil hinzufügen.

Nur padding-left:10px in Ihrem Fall verwenden .. Die Standardeinstellung ist 15 px

fiddle here

+0

Das ist was ich will.Vielen Dank Kumpel! –

+0

Gern geschehen :) –

Verwandte Themen