title: CSS3 Flexible Box Model and nested layouts
body: <p>I've been playing a little bit with CSS3 flexible box model as described in this article: <a href="http://ajaxian.com/archives/css-3-flexible-box-model" rel="nofollow">CSS 3 Flexible Box Model</a></p>
  
  <p>I am trying to create a simple vbox with a nested hbox, something like this:</p>
  
  <pre><code>&lt;div class="vbox"&gt;
      &lt;div&gt;Header&lt;/div&gt;
      &lt;div class="hbox"&gt;
          &lt;div&gt;Section 1&lt;/div&gt;
          &lt;div&gt;Section 2&lt;/div&gt;
          &lt;div&gt;Section 3&lt;/div&gt;
      &lt;/div&gt;
      &lt;div&gt;Footer&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>However the content of the hbox is being laid out vertically and not horizontally.  What am I doing wrong and how to do it correctly?  Thanks.</p>