Early Bird Registration for DrupalCon Portland 2024 is open! Register by 23:59 PST on 31 March 2024, to get $100 off your ticket.
I'm using Bootstrap 8.x-3.x-dev (2016-Feb-20) and I noticed that both the username and password input fields at /user/login are automatically stretched to fit the entire screen. This ignores the '#size' property in the FAPI, which I think should be respected.
In Bootstrap 3.0-beta2 for D8, it's a little different: the username is stretched (because it has a maxlength of 255), while the password shows the number specified for '#size' in hook_form_alter()).
Comments
Comment #2
ptmkenny CreditAttribution: ptmkenny commentedComment #3
ptmkenny CreditAttribution: ptmkenny commentedComment #4
markhalliwellThe reason they're "stretched" full width is because they both have a
form-control
class. This is part of Bootstrap's design and I'm not going to fight that out-of-the-box. There are several ways to alter this form as you see fit, in a sub-theme.Comment #5
AdamPS CreditAttribution: AdamPS at AlbanyWeb commented@markcarver Thanks for the explanation.
I am interested to know how to fix it in the sub-theme as Mark said. I'm looking for a solution that covers every form input, not just user login as a special case. I posted a question on "Drupal Answers", which is more visible than this closed issue. Or I would be very happy to get an answer here and I can transfer it across.
Comment #6
AdamPS CreditAttribution: AdamPS at AlbanyWeb commented@markcarver I appreciate you may prefer to close this again, but I have an update that I'd like to bring to your attention.
Problem
Many, many inputs ending being stretched by this code in bootstrap and it can be really unhelpful for designers working on layout.
Answer
I have figured out some CSS that seems to work quite well to disable the stretching:
Proposal
Create a new theme option, perhaps under "components"->"forms". "Use bootstrap input sizing".
True = current behavior = stretched, control with can .col-lg-*
False = add above css = obeys Drupal input sizes
Thanks
Comment #7
markhalliwellNo. This is the default behavior of Bootstrap. Any customization like this should be handled on a sub-theme basis.