Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP


Label not correctly aligned vertically with its input field #5432

marbin opened this Issue · 3 comments

3 participants


I feel that the label is not correctly aligned with its input field. The baseline of the label text should be aligned with the baseline of the input field text.
See attached image, which shows the 1.2.0 form demo page. Here Chrome 23.0.1271.97.



All labels are aligned with the top of the form element. I think this is a matter of personal preference.

If we would want to change this we run into the following issues:

  • We don't know if the label is next to a mini sized element or not
  • Labels have font-size 16px while text inputs have font-size 14px and mini sized form buttons 12.5px
  • Vertical alignment of text in form elements can be different across browsers

I think we should leave it up to the developer to align the label differently with custom CSS and close this ticket as won't fix.

@toddparker - What's your opinion?


In addition, with a native form you will get the same alignment. So I don't think we should touch this. It would make it more difficult for developers to apply their own styling. Closing this as won't fix.


To fix this and have my label aligned with its input field, when using layout grids especially, i apply margin-top to my label.
Hope this helps others when reaching this from Google.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.