<h2>2 Columns</h2>
<div class="gallery gallery-columns-2 cf">
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/700/700" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/700/700" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 2 items in gallery -->
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/700/700" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/700/700" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 2 items in gallery -->
</div>
<h2>3 Columns</h2>
<div class="gallery gallery-columns-3 cf">
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 3 items in gallery -->
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/500/500" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 3 items in gallery -->
</div>
<h2>4 Columns</h2>
<div class="gallery gallery-columns-4 cf">
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 4 items in gallery -->
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/350/350" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 4 items in gallery -->
</div>
<h2>5 Columns</h2>
<div class="gallery gallery-columns-5 cf">
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 5 items in gallery -->
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <dl class="gallery-item">
    <dt class="gallery-icon">
      <a href="javascript:void(0);"><img src="http://placekitten.com/g/250/250" /></a>
    </dt>
    <dd class="gallery-caption">caption</dd>
  </dl>
  <br style="clear: both"><!-- displayed after every 5 items in gallery -->
</div>