Results 1 to 4 of 4

Thread: vertically centre button inside toolbar

  1. #1
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default Unanswered: vertically centre button inside toolbar

    I have been adding buttons inside a toolbar like so: (this would be an item in a container)

    Code:
    {	xtype: 'toolbar',
            docked: 'top',
    	items:
    	[
    	{
    		xtype: 'button',
    		docked: 'left',
    		text: 'Back'
    	},
    	{
    		xtype: 'button',
    		docked: 'right',
    		text: 'Confirm'
    	}
    	]
    }
    But the buttons don't get placed in the centre (vertically) of the toolbar, and it looks really bad. How do I centre them?

  2. #2
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Answers
    132
    Vote Rating
    101
      0  

    Default

    You can try placing a container in the toolbar with a hbox layout with a center alignment, then putting the buttons in that container. I'm not sure I am understanding what you want to achieve.

  3. #3
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default

    If you look at the toolbar attachment I added, I want the button that says 'Search Schools' to be in the middle of the toolbar, not at the top. The same thing happens with or without the title set.
    Attached Images Attached Images

  4. #4
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Answers
    132
    Vote Rating
    101
      0  

    Default

    Search in the CSS for buttons that go on the toolbar and check if there is padding or margins on it.

    like .x-toolbar {
    or .x-toolbar .x-button {

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •