title: Overriding the Primefaces error message icon
body: <p>I have a requirement where I have to display only an error icon when there is a validation error. I am using the iconOnly attribute of primefaces message component for the same. I am trying to override the icon using the below css:</p>
  <pre><code>      .ui-message-error-icon-new {
        background: url(../img/icon-error.png) no-repeat !important;
   width: 23px; 
   height: 32px;
   margin-top: 6px;
   float: right;
   cursor: pointer;
        }
  </code></pre>
  <p>The image is getting displayed but I am unable to get the rid of the primefaces error message border.
  Please find the below screenshot:</p>
  <p><img src="https://i.stack.imgur.com/ebEhn.png" alt="Override the primefaces error icon" /></p>
  <p>Any help would be appreciated.</p>