title: Horizontal scrolling list
body: <p>I would like to have images displayed in a horizontal list.</p>
  
  <p>This is what I've done so far :</p>
  
  <pre><code>var list = Ext.create('Ext.List',{
    store: store,
    itemTpl: new Ext.XTemplate('&lt;img src="{icon}" /&gt;'),
    inline:true,
    scrollable: {
      direction: 'horizontal',
      directionLock: true
    }
  });
  </code></pre>
  
  <p>My store has 5 items, but the list only display two (because the screen is not large enough to display more than two images).</p>
  
  <p>I tried to solve this problem by setting the width of my list to 1000px like so :</p>
  
  <pre><code>style:'width: 1000px',
  </code></pre>
  
  <p>All the items are now shown, but now, the problem is the list is not scrollable anymore. I can't go further than the width of the screen.</p>
  
  <p><strong>[UPDATE]</strong></p>
  
  <p>I've tried with a hbox panel but nothing is showing. Any idea why ?</p>
  
  <pre><code>var hbox = Ext.create('Ext.Panel',{
    layout:'hbox',
    style:'background-color:red;',
    data: [
                {name: 'Jamie',  age: 100},
                {name: 'Rob',   age: 21},
                {name: 'Tommy', age: 24},
                {name: 'Jacky', age: 24},
                {name: 'Ed',   age: 26}
            ],
    tpl: new Ext.XTemplate('{name}')
  });
  
  this.setItems([hbox]);
  </code></pre>
  
  <p>I just see a red background?</p>