title: Why have conflicting properties for the same class?
body: <p>I am examining a third party CSS file, and I am coming across the same class that has the same property set multiple times but with different values each time. I cannot figure out why this is, could someone please shed some light on this? </p>
  
  <p>Example below:</p>
  
  <pre><code>.tabulator .tabulator-header .tabulator-col {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    border-right: 1px solid #aaa;
    background: #e6e6e6;
    text-align: left;
    vertical-align: bottom;
    overflow: hidden;
  }
  
  .tabulator .tabulator-row .tabulator-cell {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    padding: 4px;
    border-right: 1px solid #aaa;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  </code></pre>