DIV with negative top floating above TabLayoutPanel

[johnrellis]

Hi,

I was hoping someone could help me with a very strange issue.  We have a TabLayoutPanel sitting inside a VerticalPanel.  This in turn is in a dialog. 

There is a strange div floating above the dialog as shown in the picture below :

The div is invisible, I used the web tools to highlight it.  If it is over a button however, it prevents clicks etc.

I can inspect the element and see if is part of the TabLayoutPanel as shown in the picture below :

Does anybody have any idea what this is and how I can get rid of it?

The browser is running in standards mode and the RootLayoutPanel is being used.

Many thanks!

John

[Jens]

The div you are seeing is used by GWT's LayoutImpl class to calculate the number of pixels for a given unit (like em, ex, pct, px,... ), so you can't get rid of it (see: http://code.google.com/p/google-web-toolkit/source/browse/trunk/user/src/com/google/gwt/layout/client/LayoutImpl.java#109)

Why do you need a button outside of your dialog to be clickable? Or were you just concerned about a div you can't interpret and the button issue was just an example?

-- J

[johnrellis]

Hi Jens,

Thanks for the explanation.

The TabLayoutPanel is in a dialog that is draggable around the screen so depending on where you drag it, it puts an invisible cover on what is underneath the div.  So if I drag the dialog to just under a button group, I am unable to click some of the buttons that are under the invisible div.

It looks like all other tab panels are unsuitable for use in standards mode.  It looks like my only option is TabLayoutPanel and GWT has no Tab set implementation that is suitable for use inside a widget like this. Is this the case?

Many Thanks!!!

John

[johnrellis]

Really does seem to me that this is a bug??  Does anyone agree/disagree?

[johnrellis]

If anybody comes across this and needs a fix, I execute this in the onload of the widget containing the tab layout panel

tabPanel.getElement().getFirstChildElement().getStyle().setProperty("top","-10000ex");

Not pretty, but necessary it seems.

[Thomas Broyer]

On Friday, November 30, 2012 2:36:38 PM UTC+1, johnrellis wrote:

If anybody comes across this and needs a fix, I execute this in the onload of the widget containing the tab layout panel

tabPanel.getElement().getFirstChildElement().getStyle().setProperty("top","-10000ex");

Not pretty, but necessary it seems.

FYI, this has been fixed in trunk by using visibility:hidden: https://code.google.com/p/google-web-toolkit/source/detail?r=11324 

[johnrellis]

Thanks for the heads up!