title: create a line break within a div
body: <p>I will have 3 icons side by side that will float left when the window shrinks.  Under each icon, I'd like to add some text.  I can pretty much get it as you can see below.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.icons {
   BORDER-TOP: black 1px solid; 
    HEIGHT: 100px; 
    BORDER-RIGHT: black 1px solid; 
    WIDTH: 100px; 
    BORDER-BOTTOM: black 1px solid; 
    FLOAT: left; 
    BORDER-LEFT: black 1px solid
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="icons"&gt;div 1&lt;/br&gt;&lt;a&gt;some text&lt;/a&gt;&lt;/div&gt;
  &lt;div class="icons"&gt;div 2&lt;/div&gt;
  &lt;div class="icons"&gt;div 3&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>In jsfiddle, this <code>&lt;/br&gt;</code> tag seems to come up as invalid.  Is there a valid and / or better way to accomplish this?</p>
  
  <p><a href="http://jsfiddle.net/kp950/mum68pwv/" rel="nofollow">http://jsfiddle.net/kp950/mum68pwv/</a></p>