GWTP（Java）：在div元素上应用CSS样式

Question

I am using GWTP and I am trying to include boxcontainer style in a div element. However, it is not working. Seems that the CSS is not properly link? Any ideas? Thanks

resources/Thumbnail.css

.boxcontainer {
  width:100%;
  height:900px;
  border:0px solid #000;
  padding-top:20px;
padding-bottom:5px;
padding-right:15px;
padding-left:15px;
margin: 0px auto -1px auto; 
   background: #000000;
}

Thumbnail.ui.xml (HTML template)

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:g='urn:import:com.google.gwt.user.client.ui'>
<ui:with field="res" type="com.gw.aaaa.client.presenter.dashboard.ThumbnailResources"/>
    <div ui:field='container' class="{res.style.boxcontainer}"></div>
</ui:UiBinder>

ThumbnailResources.java

public interface ThumbnailResources extends ClientBundle {
public static final ThumbnailResources INSTANCE =  GWT.create(ThumbnailResources.class);
@Source("resources/Thumbnail.css")
ThumbnailStyle style();
}

ThumbnailStyle.java

public interface ThumbnailStyle extends CssResource {
    String boxcontainer();
}

Answer 1

You need to inject that your styles in order to be referenced. Use:

ThumbnailResources.INSTANCE.style().ensureInjected();

Only when using <ui:style> the generated CssResource is also automatically injected. With <ui:with> you are referencing an external CssResource , but you need to take care to inject it (and of course to instantiate the relative ClientBundle as you already did).

Answer 2

Instead of

<div ui:field='container' class="{res.style.boxcontainer}">

just use:

<div ui:field='container' styleName="boxcontainer">