GWT styles not applying

Question

I'm creating a GWT application that uses UiBinder, and I've come across a bizarre problem where styles aren't applying to my elements--until I refresh the browser, and then the styles briefly get applied, in that fraction of a second before the page refreshes. In other words:

1. Open page; none of my defined styles are used.
2. Hit Refresh
3. For a fraction of a second the styles are used, before the page goes blank
4. The page reloads, without the styles again

I'm going to include my entire *ui.xml file, because it's not too big.

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"&gt;
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">
    <ui:style>
        .idLabelStyle {
            font-weight: bold;
            text-align: center;
            width: 100px;
            border-style: solid;
            border-width: 1px;
            margin-right: 5px;
        }

        .nameLabelStyle {
            font-weight: bold;
            text-align: center;
            width: 500px;
            border-style: solid;
            border-width: 1px;
            margin-right: 5px;
        }

        .addressLabelStyle {
            font-weight: bold;
            text-align: center;
            width: 500px;
            border-style: solid;
            border-width: 1px;
        }
    </ui:style>
    <g:HTMLPanel>
        <g:HorizontalPanel>
            <g:Label addStyleNames="{style.idLabelStyle}">ID</g:Label>
            <g:Label addStyleNames="{style.nameLabelStyle}">Name</g:Label>
            <g:Label addStyleNames="{style.addressLabelStyle}">Address</g:Label>
        </g:HorizontalPanel>
    </g:HTMLPanel>
</ui:UiBinder> 

I really hope I'm missing something simple.

Answer 1

Instead of addStyleNames= use setStyleName= or setStylePrimaryName= I have had this issue in the past and it fixed it in my case. Note: the two possiblities are indicated below...

setStyleName
Clears all of the object's style names and sets it to the given style. You should normally use setStylePrimaryName(String) unless you wish to explicitly remove all existing styles.

setStylePrimaryName
Sets the object's primary style name and updates all dependent style names.

Answer 2

Fortunately or unfortunately, I'm no longer using this widget in my app; however, I didn't want to lose the code, because this problem was driving me nuts and I wanted to know what I was missing.

Unfortunately, after changing my code around, and then re-adding the widget to test it, I can't reproduce the problem anymore.

It might be the way I'm adding the widget to my UI; I don't remember how I was originally adding it (it was too many changes ago), but I'm now adding it to a VerticalPanel by using the add(Widget) method, and the styles are now applying with no problem.

Thanks to the commenters who followed me on my wild goose chase. I wish I had a more satisfactory answer...