Setting item margins in Sencha Touch (and ExtJS)

The following code shows how I set the margins on a Sencha Touch component (an item in a list of items):

    xtype: 'container',
    style: 'text-align: left; margin-left: 26px; margin-top:14px;',
    html: '<div>Funny - 20<br/>Voted Yes, But Not Worth It - 2</div>',
    id: 'checkboxView',

As shown, you do this by setting the style on the component.

It seems like the following code should have also worked, but it didn’t:

style: 'text-align: left; margin: 14px 0 0 28px;',

I may have just typed something wrong, but after not getting it to work a couple of times, I went with the code shown initially (above).

Add new comment

The content of this field is kept private and will not be shown publicly.

Anonymous format

  • Allowed HTML tags: <em> <strong> <cite> <code> <ul type> <ol start type> <li> <pre>
  • Lines and paragraphs break automatically.
By submitting this form, you accept the Mollom privacy policy.