title: Bootstrap 4 "hidden" class doesn't work consistently
body: <p>I am having problems using the "hidden" class to hide content at a certain size. It works on some content, but not on others.</p>
  
  <p>I use: </p>
  
  <pre><code>    &lt;div class="hidden-sm"&gt;something to hide in small viewports &lt;/div&gt;
  </code></pre>
  
  <p>I've tried it on navigation brand logo and it works, but it doesn't work on the navbar, some pictures etc...</p>
  
  <p>Using the code below works (but hides it permanently)</p>
  
  <pre><code>&lt;div hidden&gt; something to hide in small viewports &lt;/div&gt;
  </code></pre>
  
  <p>Using the code below doesn't work at all</p>
  
  <pre><code>&lt;div hidden-sm&gt; something to hide in small viewports &lt;/div&gt;
  </code></pre>
  
  <p>Could someone explain the usage a little? Bootstrap docs don't provide too many details </p>
  
  <p>Also, as you can clearly tell, I am not very good with CSS or JavaScript, so I would really rather just import bootstrap from the CDN without creating my own CSS files. (if possible)</p>