Vertical Alignment of Dropdown list & Date/Time pickers

3 posts, 0 answers
  1. Vivek
    Vivek avatar
    13 posts
    Member since:
    Aug 2011

    Posted 04 Feb 2012 Link to this post

    When placed in a line, there's a noticeable difference in the vertical alignment of the dropdown list and date/time pickers when compared to text-boxes.(please see the attached file)

    I suspect this can be fixed by changing the height or padding of the text box which appear to be slightly too bulky.

    How can I resolve this?
  2. Dimo
    Admin
    Dimo avatar
    8457 posts

    Posted 06 Feb 2012 Link to this post

    Hi Vivek,

    You can apply a vertical-align style (e.g. "middle") to the Add button and the regular textboxes in order to achieve better alignment.

    The regular textboxes are higher than the DatePicker, which can be resolved by applying a suitable vertical padding. Note that the padding styles are cyurrently set in em's, which make them depend on the font-size. You can reset them in pixels if you want.

    input.k-textbox
    {
          padding-top: ...... ;
          padding-bottom: ...... ;
    }

    Regards,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Vivek
    Vivek avatar
    13 posts
    Member since:
    Aug 2011

    Posted 09 Feb 2012 Link to this post

    Thanks! I'll try it out.
Back to Top