Right align items on Toolbar

5 posts, 0 answers
  1. squawk
    squawk avatar
    1 posts
    Member since:
    Jul 2014

    Posted 22 Jul 2014 Link to this post

    I'm trialing Kendo UI and currently experimenting with the Toolbar widget.  Got it working ok, but I need to right align certain items on the toolbar - any idea how I would do this?
  2. Danny Fritz
    Danny Fritz avatar
    18 posts
    Member since:
    Jul 2012

    Posted 22 Jul 2014 in reply to squawk Link to this post

    In the source code I'm seeing an option for align, but it isn't documented. Try passing in align: 'right'.
  3. Iliana Nikolova
    Iliana Nikolova avatar
    2570 posts

    Posted 22 Jul 2014 Link to this post


    To achieve this you should override the default styling using custom CSS rules. For your convenience here is a simple example which demonstrates a possible implementation. 

    Iliana Nikolova
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  4. Marcel
    Marcel avatar
    35 posts
    Member since:
    Apr 2011

    Posted 03 Sep 2014 Link to this post


    Using float:right on the items works fine in all browsers except Firefox (latest version).
    In Firefox the menu item floats right, but doubles the height of the toolbar with that item at the right-bottom.
    You can reproduce this using Firefox with the example you gave.

    Any ideas how to fix this ?

    Thanks in advance.
  5. Marcel
    Marcel avatar
    35 posts
    Member since:
    Apr 2011

    Posted 04 Sep 2014 in reply to Marcel Link to this post

    Never mind... I found the problem (as i suspected) and fix.
    If you use float:right on toolbar items, make sure to add them as the First items in the options.items.
    Apparently Firefox is very strict on floats.
Back to Top