Showing one widget over other panel - css

Question

I'm working with GWT and I have a problem trying to show one VerticalPanel over other panel. I have two panels in my app: one as a menu bar and the other one as a main content. The VerticalPanel is the menu bar and when you move the mouse over it, it is opened showing you more options(widgets). The problem is that this new widgets are hidden by the panel which is below the menu bar. I want to show the whole widget even if it's partially "invading" another panel. I've tried the z-index property with CSS but I can't get it.
public class Example2 implements EntryPoint {
public void onModuleLoad()
{
//Creating the layout which one will contain two simplePanels
DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.EM);
dockLayoutPanel.setStylePrimaryName("layout");
//Creating the two Simplepanels
SimplePanel menuPanel = new SimplePanel();
menuPanel.setStylePrimaryName("menuPanel");
SimplePanel mainContentPanel = new SimplePanel();
mainContentPanel.setStylePrimaryName("mainContentPanel");
//Adding panels to the DockLayoutPanel
dockLayoutPanel.addNorth(menuPanel, 10);
dockLayoutPanel.add(mainContentPanel);
VerticalPanel vPanel = new VerticalPanel();
//Creating some buttons
Button a = new Button("Button");
vPanel.add(a);
Button b = new Button("MoreButton");
vPanel.add(b);
Button c = new Button("AnotherButton");
vPanel.add(c);
Button d = new Button("ButtonButton");
vPanel.add(d);
Button e = new Button("LastButton");
vPanel.add(e);
//Adding the buttons to the menuPanel(simplePanel)
menuPanel.add(vPanel);
RootLayoutPanel rp = RootLayoutPanel.get();
rp.add(dockLayoutPanel);
}
}
And the .css
.layout{
font-size:10px;
}
.menuPanel{
background:#e8f8ff;
}
.mainContentPanel{
background:#eee9e9;
}
With this example you might see my point. I know it's a dumb one, but it shows my problem. The buttons that are added to the vPanel are shown as long as they occupy space in the menuPanel, the rest are hidden under the mainContentPanel.

Answer 1

It can be as simple as changing the order in which you add menu panel and main panel to their parent widget. Add main panel first, then menu panel. Obviously, it's hard to be sure without seeing your code.