Menu
If it possible to get right-align labels in twitter bootstrap form-horizontal?
So in this example of horizontal form http://twitter.github.com/bootstrap/base-css.html#forms letter "E" in "Email" will be over letter "P" in "Password".
351
Use the . form-horizontal class in Bootstrap to align labels and groups of form controls in a horizontal layout.
We specify the margin-bottom of our <div> element. Then, we set the display of the <label> element to "inline-block" and give a fixed width. After that, set the text-align property to "right", and the labels will be aligned with the inputs on the right side.
Horizontal formCreate horizontal forms with the grid by adding the .row class to form groups and using the .col-*-* classes to specify the width of your labels and controls. Be sure to add .col-form-label to your <label> s as well so they're vertically centered with their associated form controls.
Bootstrap allows us to align elements by using the utility class float. As we want to align the button to the right side of the text box, we have to use the float-right class.
Actually, they are right aligned as it is. I think you want to left align them (so P is over E) if I understand correctly. If so, you can try this:
.form-horizontal .control-label {
text-align: left;
}
(it's "text-align: right;" by default in bootstrap.css)
57
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
