title: CSS being overridden in Wordpress theme
body: <p>I have a div with 3 columns, each column set to contain a thumbnail image link. I've styled this div  - <code>.reading-pane</code> - to have the right margins and borders in order to accommodate my design. There is also an inner div
   - <code>row_inner_wrapper</code> - that is created by the theme I'm using. There is no width set for this div - it should just accommodate the three thumbnail divs. However, the <code>.row_inner_wrapper</code> div is wider than the total of the image divs and making my <code>.reading-pane</code> div extend off the right of the page.</p>
  
  <p>I can find no styling that should cause this using Firebug. However, in Chrome I can see that there is a right margin applied when I mouse over this div, even though there are no such styling rules applied. I can even set <code>margin:0px !important</code> on this div and the margin remains. Any suggestions on where my phantom CSS may be coming from?</p>
  
  <p>You can see the page in question here <a href="http://jpsingh.samcampsall.co.uk/galleries/" rel="nofollow">http://jpsingh.samcampsall.co.uk/galleries/</a></p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="reading-pane"&gt;
      &lt;div class="row_inner_wrapper"&gt;
          &lt;div class="row_inner"&gt;
              &lt;div class="themify_builder_sub_row clearfix"&gt;
                  &lt;div class="col3-1"&gt;
                  &lt;/div&gt;
                  &lt;div class="col3-1"&gt;
                  &lt;/div&gt;
                  &lt;div class="col3-1"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.reading-pane{
  background-color:#ffffff;
  background-image: url('leftcolumn.png');
  background-repeat:repeat-y;
  margin:30px;
  padding:25px 25px 25px 103px;
  }
  .row_inner_wrapper{
  margin:0px 0px 0px 0px !important;
  }  
  </code></pre>