adding an image to a grid in UiBinder

[Arian Gerryts]

I am trying to add a Label to a grid and another label in the next cell to display an image of an asterisk.
The image of the asterisk however displays twice, once in front of the first label and again just after it.

Which will be the best way to add this image in the xml file so that it displays properly.

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
	         xmlns:g="urn:import:com.google.gwt.user.client.ui">
	 <ui:image field="requiredImage" src="images/required_indicator.gif"/>
	  
	<ui:style type="com.equillore.mcmexternal.client.ui.IndicatorLabel.Style">
        @sprite 
        .required
         {
            gwt-image: 'requiredImage';
            width: 7px;
            height: 14px;
        }
        .labRequired
        {
			color:#303030;
			font-family: Arial, Helvetica, sans-serif;
			font-size:5;
			font-style:normal;
			font-weight:500;
		}
    </ui:style>
    <g:SimplePanel width='90px' height='21px'>
	<g:Grid>
	    <g:row>
            <g:customCell>
                <g:Label ui:field="label" addStyleNames="{style.labRequired}"/>
            </g:customCell>
            <g:customCell>
                <g:Label addStyleNames="{style.required}"/>
            </g:customCell>
        </g:row>
	</g:Grid>
	</g:SimplePanel>
	
	
</ui:UiBinder> 

Kind regards