title: Detecting CSS browser inconsistent rendering by means of JavaScript?
body: <p>I have a <code>input[type="text"]</code> that has padding applied to it and it behaves differently in firefox PC then on a mac.</p>
  
  <p>Can I debug this inconsistency with JavaScript?
  Based on the code below, does anyone have any sugestions to resolve my issue?</p>
  
  <h3>Firefox on Windows (firebug inspection)</h3>
  
  <pre><code>.searchContainer input {
     border-color:#7C7C7C #C3C3C3 #DDDDDD;
     border-style:solid;
     border-width:1px;
     color:#555555;
     float:left;
     height:12px;
     padding:3px;
    }
  </code></pre>
  
  <h3>Firefox on Mac(firebug inspection)</h3>
  
  <pre><code>.searchContainer input  {
     border-color:#7C7C7C #C3C3C3 #DDDDDD;
     border-style:solid;
     border-width:1px;
     color:#555555;
     float:left;
     height:12px;
     padding:3px;
   }
  </code></pre>
  
  <p>No other styles are applied to these inputs. </p>
  
  <p>Any suggestions?</p>