title: hr line between two divs
body: <p>Following is my fiddle in which I am trying to give hr line between two <code>floating</code> divs . Kindly let me know how can I give a responsive line between two floating divs.</p>
  
  <p><a href="http://jsfiddle.net/NH5Lc/5/" rel="nofollow">http://jsfiddle.net/NH5Lc/5/</a></p>
  
  <pre><code>&lt;div style="display:inline-block; float: left;"&gt;Calories&lt;/div&gt;
  &lt;div style="inline-block"&gt;
      &lt;hr class="between" /&gt;
  &lt;/div&gt;
  &lt;div style="display:inline-block; float: right;"&gt;20&lt;/div&gt;
  &lt;br/&gt;
  &lt;div style="display:inline-block; float: left;"&gt;Calories&lt;/div&gt;
  &lt;div style="inline-block"&gt;
      &lt;hr class="between" /&gt;
  &lt;/div&gt;
  &lt;div style="display:inline-block; float: right;"&gt;20&lt;/div&gt;
  </code></pre>