title: How to make this list of images responsive (scalable)?
body: <p>I just implemented a star rating system on my site, but I'm having a hard time making the images scale alongside my other content. The HTML code I'm using is:</p>
  
  <pre><code>&lt;ul id="aff_rating"&gt;
      &lt;li&gt;&lt;img src="/images/star_on.png" class="star_on starrating-1"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;img src="/images/star_on.png" class="star_on starrating-2"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;img src="/images/star_on.png" class="star_on starrating-3"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;img src="/images/star_on.png" class="star_on starrating-4"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;img src="/images/star_off.png" class="star_off starrating-5"&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I need the stars to scale down as a user resizes their browser window just like the other images on the page.</p>