title: How to set jquery ui icon as background image per css?
body: <p>How can I set a jquery ui icon as a background image per a css container?</p>
  
  <p>Something like:</p>
  
  <pre><code>.MyClass {
    background: url("ui-icon-plus");
  }
  
  // Existing div...want to add icon to left-align
  &lt;div class="MyClass"&gt;
     //Other stuff in there that expands and collapses
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>UPDATE</strong></p>
  
  <p>How can I get the following text to appear to the right of the icon?</p>
  
  <pre><code>&lt;div class="MyClass"&gt;Whatever&lt;/div&gt; &lt;!-- no workee--&gt; 
  &lt;div class="MyClass"&gt;&lt;span class="MC"&gt;Whatever&lt;/span&gt;&lt;/div&gt; &lt;!-- works --&gt; 
  
   .MyClass {
        width: 16px; height: 16px; background-image: url("../../Content/themes/base/images/ui-icons_222222_256x240.png")/*{iconsContent}*/;
        background-position : -16px -128px; 
  }
  .MC {
     padding-left: 20px;   
  }
  </code></pre>