Need to remove extra pixel showing in Safari when using display: table
<p>I'm working with a bootstrap based site. I have a problem where we are trying to get the two column heights to be equal despite the size of the content inside the columns, and without setting a column height (to keep it responsive). </p>

<p>I have googled my brains out and decided that the <strong>display: table</strong>, <strong>display: table-cell</strong> is the appropriate way to fix this (we support IE9, so Flexbox is OUT, and the negative margin/padding thing breaks responsiveness). I have specific media queries to fix responsiveness based on screen size. </p>

<p>However, I am getting a single pixel of what appears to be padding on the left side of my smaller column in Safari (it looks perfect in IE, Chrome, Firefox and Edge). After looking through the inspector, I can tell that it's not margin or padding causing the pixel, so I'm not sure how to fix it. I tried <strong>border-collapse: collapse</strong> to no avail. If I remove the <strong>display: table</strong> or <strong>display: table-cell</strong>, it looks correct, but I need those to make the columns the same height (<a href="http://i.stack.imgur.com/am6TE.jpg" rel="nofollow">see example here</a>). Any ideas? Code is below.</p>

<pre><code>&lt;style&gt;
.row-tbl {
    display: table;
}
.col-tbl-cell {
    float: none;
    display: table-cell;
}
.blue-bg {
    background-color: blue;
}
.white-bg {
    background-color: white;
}
&lt;/style&gt;


&lt;div class="row row-tbl"&gt;
    &lt;div class="col-md-4 col-tbl-cell blue-bg"&gt;
        &lt;!-- This displays as a table cell --&gt;
        &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit.&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="col-md-8 white-bg"&gt;
        &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ac tempus sem, nec luctus tellus. Integer erat urna, fermentum sit amet porttitor at, rhoncus non arcu. Aenean a libero consectetur metus imperdiet scelerisque at ut nibh. Sed mauris mauris, facilisis nec nulla at, cursus imperdiet magna.&lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>