putting two label beside each other in gwt

Question

Code:

RootPanel footer = RootPanel.get("footer");
footer.addStyleName(StyleNameGen.createName("mainWidgetFooterStyle"));
footer.add(versionLabel);
footer.add(expirationMessage);

and it puts the versionLabel and thenexpirationMessage `below it.

What to do if I want to put the versionLabelbesides the expirationMessage?

Answer 1

You have to add them both to another container first like a HorizontalLayoutContainer or an HBoxLayoutContainer.

HorizontalLayoutContainer labelContainer = new HorizontalLayoutContainer()
labelContainer.add(versionLabel, new HorizontalLayoutData(-1, -1, new Margins(5)));
labelContainer.add(expirationMessage, new HorizontalLayoutData(-1, -1, new Margins(5)));
footer.add(labelContainer);

Answer 2

If I properly understand you need to place 2 label one over another. For this you can try:

FlowLayoutContainer somePanel = new FlowLayoutContainer();
mixCont.add(somePanel);
Label versionLabel = new Label("12345678");
Label expirationMessage = new Label("9999999");
versionLabel.getElement().getStyle().setFloat(Style.Float.LEFT);
expirationMessage.getElement().getStyle().setPosition(Position.ABSOLUTE);
expirationMessage.getElement().getStyle().setLeft(20, Unit.PX);
somePanel.add(versionLabel);
somePanel.add(expirationMessage);

Actually next code should solve your problem. Second row helps you in positioning your overlapping message:

expirationMessage.getElement().getStyle().setPosition(Position.ABSOLUTE);
expirationMessage.getElement().getStyle().setLeft(20, Unit.PX);