부트 스트랩 : 폼 수평

Question

내가 트위터 부트 스트랩을 사용하고 여기에 데모에서와 같이 수평 형태를하고 싶은 예상대로 스타일링하지 : 그러나 http://twitter.github.com/bootstrap/base-css.html#forms

, 나는 레이블 추측 수직 형태의 종류를 얻을 컨트롤을 통해, 나는 왜 수직 형 스타일링이 작동하지 않는지 알 수 없다. 여기

는 HTML 코드 (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>