Results 1 to 2 of 2

Thread: Slider inside HBox : centering and spacing issues

  1. #1
    Ext User
    Join Date
    Mar 2010

    Default Slider inside HBox : centering and spacing issues

    I am going to assume that a Slider cannot go inside a CompositeField because the Designer won't let it happen.
    So I'm putting one, along with two other components, inside an HBox. I want them to be centered with a little space between each:

    {abcDisplayField} {Number Field} {Slider}

    I've wrapped the HBox in a container and am applying CSS to the wrapper to center its contents. When the contents are centered, they're shifted to the left, as if the centering algorithm were working with a slider width that is much greater than it actually is.


    How do I get these fields properly centered in their HBox and also put a little space between the components?

    Thanks for the help.

  2. #2
    Sencha User jarrednicholls's Avatar
    Join Date
    Mar 2007
    Frederick, MD


    Please see the "flex" (for sizing) and "pack" (for centering) layout options for HBox in the documentation. Setting "pack" to "center" will center your items in the HBox layout. You can then apply a "margins" configuration to space out your items.

    For further questions regarding the Ext JS library, you can post on the Ext JS forums and also see the Ext JS documentation at

Posting Permissions

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