Simple BorderLayout example works in Hosted mode/IE, blank screen for everything else

[dpovey]

Hi All,

I am a relative newcomer to Gxt so apologies if this is an FAQ. I am having problems working with BorderLayout. I have been working away happily using Hosted Mode and viewing with IE7, but when I attempt to view using Firefox or Safari I get a blank screen.

I managed to narrow it down to the following test case:

import com.extjs.gxt.ui.client.Style.LayoutRegion;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.Html;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.Viewport;
import com.extjs.gxt.ui.client.widget.layout.BorderLayout;
import com.extjs.gxt.ui.client.widget.layout.BorderLayoutData;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class FailedExample implements EntryPoint {

public class TestLayout extends LayoutContainer {
public TestLayout() {
setLayout(new BorderLayout());
add(new Html("North"), new BorderLayoutData(LayoutRegion.NORTH, 100));
add(new Html("East"), new BorderLayoutData(LayoutRegion.EAST, 200));
add(new Html("West"), new BorderLayoutData(LayoutRegion.WEST, 200));
add(new Html("Center"), new BorderLayoutData(LayoutRegion.CENTER));
add(new Html("South"), new BorderLayoutData(LayoutRegion.SOUTH, 100));
}
}

public void onModuleLoad() {
Viewport viewport = new Viewport();
viewport.add(new TestLayout());
RootPanel.get().add(viewport);
}
}

Which renders okay on IE7 and in hosted mode in Windows (although I am not seeing "South" for some reason), but gives me blank screen in Safari and Firefox 3.

Help!

Dean.

[dpovey]

Just adding. This is GWT 1.5.3 and Gxt 1.1.4. When I use Firebug in firefox I can see that the DOM is all nicely filled in with the right things, just nothing is displayed in the browser.