removing left/right padding on col-md-6 Bootstrap
<p>I have a site utilizing Bootstrap but I want to override the left and right padding on just the columns col-md-6 (set them to 0px). Not sure how to do it, my current set up is ...</p>

<p>css</p>

<pre><code>.fix-gutters &gt; [class^="col-"],
.fix-gutters &gt; [class*=" col-"] {
  padding-right: 0px;
  padding-left: 0px;
}
</code></pre>

<p>and applying it to </p>

<pre><code>&lt;div id="main" class="row fix-gutters"&gt;

    .... &lt;div class="col-md-6"&gt; ... etc.
</code></pre>

<p>but that col-md-6 sometimes gets replaced (Wordpress loop) with a col-md-12 div and I don't want .fix-gutters to apply if that's the case.</p>

<p>NOTE: i need the override to happen on the same level as the col-md-6 command. example</p>

<pre><code>&lt;div class="col-md-6 overide-class"&gt;
</code></pre>