title: Why Can I not display this span in chrome but I can in FF?
body: <p>I have the following CSS:</p>
  
  <pre><code>.views-imagematrix-block .views-field-title .field-content &gt; a .promotedstar {
      position: relative;
      top: -6px;
  }
  .promotedstar {
      background: url("../img/icons/Star.png") no-repeat scroll 0 0 transparent;
      font-weight: bold;
      height: 25px;
      padding-bottom: 10px;
      padding-right: 25px;
      position: relative;
      top: 0;
      width: 25px;
  }
  </code></pre>
  
  <p>And the following html:</p>
  
  <pre><code>&lt;div class="views-field views-field-title"&gt;
      &lt;span class="field-content"&gt;&lt;a href="/content/gershwins-coffee-house"&gt;&lt;span class="promotedstar"&gt;&lt;/span&gt;&amp;nbsp;Gershwins Coffee House&lt;/a&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This gives the full desired effect in Firefox, however in Chrome... It shows the span as being outside of the div (to the left), and doesn't show even with overflow: visible; set to the containing divs. (the span doesn't take the padding it seems). I don't know how to remedy this... </p>