title: Dojo layout - two panels inside a panel
body: <p>I've just started learning dojo for an evaluation exercise (we may be using it at work). The timescales on project probably won't allow me to learn this from the ground up, so I'm jumping in the deep end. I was wondering if anyone could point me in the right direction;</p>
  
  <p>The below code represents a page from their tutorial;</p>
  
  <p><a href="http://dojotoolkit.org/documentation/tutorials/1.6/dijit_layout/demo/appLayout.html" rel="nofollow">http://dojotoolkit.org/documentation/tutorials/1.6/dijit_layout/demo/appLayout.html</a></p>
  
  <p>^^ What it's meant to look like.</p>
  
  <p>I've got that working, but I want two panels to be in the centre section: A plain content panel at the top, and a tabs panel underneath it. The below code represents how i thought I might achieve this. What I'm finding is that if I comment out the content pane (the one with "Hello world" in) then it "takes over" its parent content pane, and the tabs panel is no longer even shown. Uncomment it, and i get my tabs back.</p>
  
  <p>Is anyone able to point me in the direction of a good example of how to do this?</p>
  
  <pre><code>&lt;div id="appLayout" class="demoLayout" data-dojo-type="dijit.layout.BorderContainer"
      data-dojo-props="design: 'headline'"&gt;
  
      &lt;div class = "centrePanel"
          data-dojo-type="dijit.layout.ContentPane"
          data-dojo-props="region: 'center'"&gt;
  
              &lt;%-- I want to uncomment this bit!!
              &lt;div 
                  data-dojo-type="dijit.layout.ContentPane"
                  data-dojo-props="region: 'top'"&gt;
                      Hello World                    
              &lt;/div&gt;
              --%&gt;
  
              &lt;div 
                  data-dojo-type="dijit.layout.TabContainer"
                  data-dojo-props="region: 'center'"&gt;
                  &lt;asp:ContentPlaceHolder ID="MainContent" runat="server"&gt;
                  &lt;/asp:ContentPlaceHolder&gt;                    
              &lt;/div&gt;                
  
  
  
      &lt;/div&gt;        
      &lt;div class="edgePanel" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'top'"&gt;Header content (top)&lt;/div&gt;
      &lt;div id="leftCol" class="edgePanel" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region: 'left', splitter: true"&gt;Sidebar content (left)&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>