DockLayoutPanel doesn't work correctly??

Suppose you'd like to create a layout like the following using GWT:

With GWT 2.0 the documentation suggests to use the DockLayoutPanel.

<g:DockLayoutPanel unit='EM'>
  <g:north size='4'>
    <g:Label>Header</g:Label>
  </g:north>

  <g:west size='16'>
    <g:Label>Navigation</g:Label>
  </g:west>

  <g:center>
    <g:ScrollPanel>
      <g:Label>Content Area</g:Label>
    </g:ScrollPanel>
  </g:center>
</g:DockLayoutPanel>

However pay attention, this won't work if you use the standard mechanism like

public void onModuleLoad() {
 RootPanel.get("main").add(new MainUI());
}

where the new MainUI() contains the DockLayoutPanel as root element (I assume you're using GWT's new UiBinder mechanism), then the DockLayoutPanel won't work surprisingly.

Instead you have to use

public void onModuleLoad() {
   RootLayoutPanel panel = RootLayoutPanel.get();
   panel.add(new MainUI());
}

---

Questions? Thoughts? Hit me up on Twitter