बूटस्ट्रैप: फार्म क्षैतिज स्टाइल नहीं के रूप में

Question

मैं चहचहाना बूटस्ट्रैप उपयोग कर रहा हूँ और के रूप में डेमो यहाँ में दिखाया गया है एक क्षैतिज रूप करना चाहते हैं की उम्मीद: http://twitter.github.com/bootstrap/base-css.html#forms

हालांकि, मैं खड़ी प्रपत्र का एक प्रकार मैं लेबल के साथ लगता है कि मिल नियंत्रण में, मुझे नहीं पता कि ऊर्ध्वाधर रूप स्टाइल क्यों काम नहीं कर रहा है।

यहाँ एचटीएमएल कोड है (symfony2 ढांचे के साथ उत्पन्न:

<form class="form-horizontal" method="POST" action="/yourownpoet/web/app_dev.php/register/"> 
    <label class=" required" for="fos_user_registration_form_email" placeholder="Email">Email:</label> 
    <input id="fos_user_registration_form_email" class="text-style" type="email" placeholder="Email" required="required" name="fos_user_registration_form[email]"> 
    <div placeholder="Password" id="fos_user_registration_form_plainPassword"> <div> 
     <label class=" required" for="fos_user_registration_form_plainPassword_Enter Password: ">Enter password: </label> 
     <input type="password" required="required" name="fos_user_registration_form[plainPassword][Enter Password: ]" id="fos_user_registration_form_plainPassword_Enter Password: " class="text-style"> 
    </div> 
    <div> 
     <label class=" required" for="fos_user_registration_form_plainPassword_Verify Password: ">Verify password: </label> 
    <input type="password" required="required" name="fos_user_registration_form[plainPassword][Verify Password: ]" id="fos_user_registration_form_plainPassword_Verify Password: " class="text-style"> 
</div> 
    etc... 
</form> 

वहाँ कुछ मैं गलत कर रहा हूँ है

Answer 1

आप अपने लेबल के लिए .control-label वर्ग लागू करते हैं और एक के अंदर अपने आदानों को अलग करने की जरूरत है? .controls सही ढंग से आवेदन करने के लिए अपनी फॉर्म शैलियों के लिए कंटेनर। इसके बजाय इसे आजमाएं:

<form class="form-horizontal" method="POST" action="/yourownpoet/web/app_dev.php/register/"> 
    <div class="control-group"> 
     <label class="control-label required" for="fos_user_registration_form_email" placeholder="Email">Email:</label> 
     <div class="controls"> 
      <input id="fos_user_registration_form_email" class="text-style" type="email" placeholder="Email" required="required" name="fos_user_registration_form[email]"> 
      <div placeholder="Password" id="fos_user_registration_form_plainPassword"></div> 
     </div> 
    </div> 

    <div class="control-group"> 
     <label class="control-label required" for="fos_user_registration_form_plainPassword_Enter Password: ">Enter password: </label> 
     <div class="controls"> 
      <input type="password" required="required" name="fos_user_registration_form[plainPassword][Enter Password: ]" id="fos_user_registration_form_plainPassword_Enter Password: " class="text-style"> 
     </div> 
    </div> 
    <div class="control-group"> 
     <label class="control-label required" for="fos_user_registration_form_plainPassword_Verify Password: ">Verify password: </label> 
     <div class="controls"> 
      <input type="password" required="required" name="fos_user_registration_form[plainPassword][Verify Password: ]" id="fos_user_registration_form_plainPassword_Verify Password: " class="text-style"> 
     </div> 
    </div> 
</form>