title: Setting size for icon in CSS
body: <p>I'm working on JSF, and I'm using this code to display an error box. </p>
  
  <pre><code>&lt;div class="pnx-msg pnx-msg-warning clearfix"&gt;
      &lt;i class="pnx-msg-icon pnx-icon-msg-warning"/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The <code>&lt;i class.../&gt;</code> part imports a warning icon. It's default size is 36 px, but I need to resize it to 24 px. How do I do this?</p>
  
  <p>Thanks!</p>