2016-03-27 7 views
0

Hallo ich benutze Bootstrap 3 und während ich das Problem der Dimensionierung meiner Benutzereingaben konfrontiert habe ich nahm Hilfe von diesem question shadowf Antwort hat mir geholfen.Bootstrap 3 Eingabebreite und lable Sizing in Form-Gruppe

Jetzt bin ich in ein anderes Problem. Die Größe des Fixes wird zwar angepasst, es gilt jedoch für die Beschriftung und das Steuerelement innerhalb der Formulargruppe, wenn die Klasse auf dieser Ebene angewendet wird.

Ich muss verschiedene Größen für das Etikett und die Eingabebox anwenden. Wenn ich die Größenklasse auf die Beschriftung oder die Eingabeebene anwende, wird die Formularausrichtung für einen Toss verwendet.

Ich möchte kein horizontales oder Inline-Formular verwenden.

<div class="form-group col-xs-6"> 
<label for="exampleInputEmail1">Really long label which I want to have separate sizing</label> 
<input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email"> 
</div> 

modifizierte Geige here

Antwort

2

Scheint, wie Sie die Linien zwischen dem Text-Label und das Eingabefeld aufteilen müssen. Dann können Sie den Text machen das ganze 12 Rastersystem folgen, während die Eingabe verwendet nur 6 Blöcke im System:

<div class="form-group"> 
    <div class="row"> 
    <div class="col-xs-12"> 
     <label for="exampleInputEmail1">Really long label which I want to have separate sizing</label> 
    </div> 
    </div> 
    <div class="row"> 
    <div class="col-xs-6"> 
     <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email"> 
    </div> 
    </div> 
</div> 

JSFiddle. Ich habe nichts mit dem Passwort-Feld getan, aber Sie bekommen den Punkt. Viel Glück!

+1

danke, dass es für mich behoben – Ananda

+0

Gern geschehen! :-) – NiklasMH