title: GWT ImageResource accessed within a CSS property?
body: <p>The Google/GWT example of creating an ImageResource is understood:</p>
  
  <pre><code>interface MyResources extends ClientBundle {
    @Source("image.png")
    ImageResource image();
  
    @Source("my.css");
    CssResource css();
  }
  
  @sprite .myImage {
    gwt-image: 'image';
  }
  </code></pre>
  
  <p>I understand how to use ImageResources and apply style names, however... </p>
  
  <p>In my application, I have multiple themes that are applied to various widgets using CSS and deferred binding.  So I have defined a CSS rule ('background') that I would like to use the .myImage class, but it does not do anything:</p>
  
  <pre><code>background {
      background-attachment: fixed;
      background-image: .myImage;  //??  This is the question!
      background-size: contain
  }
  </code></pre>
  
  <p>What is the syntax for using the .myImage class within the 'background' CSS property?  It seems I should be able to specify the .myImage class as the argument for background-image.</p>
  
  <p><strong>Edit: Did some more research and found the correct syntax to do this using a DataResource.</strong></p>
  
  <pre><code>MyClientBundle extends ClientBundle {
  
      //Background Image
      @Source("resources/background.png")
      DataResource backgroundImage();
  
  }
  </code></pre>
  
  <p>(mypanel.css)</p>
  
  <pre><code>@url background backgroundImage;
  
  .myPanel {
      border-radius: 0px;
      background-color:#ffffff;
      opacity:0.6;
      background-image: background;
  }
  </code></pre>