<p dir="auto">See <a href="http://jsbin.com/taxat/1/" rel="nofollow">http://jsbin.com/taxat/1/</a><br>
Tested on MacOS 10.8.5, Firefox 26 and Chrome 32.</p>
<p dir="auto">Using</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;div class=&quot;hidden-md hidden-lg&quot;&gt;XS and SM - via hidden&lt;/div&gt;"><pre class="notranslate"><code class="notranslate">&lt;div class="hidden-md hidden-lg"&gt;XS and SM - via hidden&lt;/div&gt;
</code></pre></div>
<p dir="auto">the content is shown in both xs and sm resolutions. Correct.</p>
<p dir="auto">But using</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;div class=&quot;visible-xs visible-sm&quot;&gt;XS and SM - via visible&lt;/div&gt;"><pre class="notranslate"><code class="notranslate">&lt;div class="visible-xs visible-sm"&gt;XS and SM - via visible&lt;/div&gt;
</code></pre></div>
<p dir="auto">the content is only shown in sm resolution. Not correct, content should show in xs as well.</p>
<p dir="auto">Probably similar issue with other resolution combinations.</p>
<p dir="auto"><a href="https://dl.dropboxusercontent.com/u/37682778/error/index.html" rel="nofollow">https://dl.dropboxusercontent.com/u/37682778/error/index.html</a></p>