title: How to determine which grid option is currently used
body: <p>I use Bootstrap 3 for a web page that is created using PHP and HTML.</p>
  
  <p>With the responsive grid and classes on <strong>Bootstrap 3</strong> you can assign multiple classes to a div to define different widths depending on the current screen size - exmaple:</p>
  
  <pre><code>&lt;div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"&gt;...&lt;/div&gt;
  </code></pre>
  
  <p>This refers to the screen size using <code>col-lg</code> for large devices, <code>col-md</code> for medium devices, <code>col-sm</code> for small devicesand <code>col-xs</code> for extra small devices.<br>
  It works as intended but I am wondering how I can determine which of these classes Bootstrap is using at the moment so that I can show the current size version on the screen.</p>
  
  <p>Is there a way I can determine which of the above grid options / col classes is currently active using PHP (or jQuery)? I could not find a proper solution for this myself.</p>