我正在使用twitter bootstrap,并希望有一个水平表单,如下面的演示所示：
http://twitter.github.com/bootstrap/base-css.html#forms
但是,我得到一种垂直形式,我猜标签超过控制,我无法找到为什么垂直形式样式不起作用.
<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>
有什么我做错了吗？
解决方法
您需要将.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>