title: Adding or Forcing Line Break after div
body: <p>I have a <code>div</code> that hold some anchor tags as shown below. And also a <code>&lt;hr&gt;</code> tag to segment my page. however even using the div as a <em>block</em> element wouldn't force the <code>&lt;hr&gt;</code> element to start on a new line rather it aligns the <code>&lt;hr&gt;</code> next to the div. </p>
  
  <p>how can i resolve this?</p>
  
  <pre><code>&lt;div id="inner"&gt;
      &lt;div id="headerBlock"&gt;
          &lt;a href='.actorgroup' id='346' onclick='return displayactorgroupFunc(this.id);'&gt;Actor2&lt;/a&gt;
          &lt;span class='rowNumber2'&gt; | &lt;/span&gt;
          &lt;a href='.actorgroup' id='15201' onclick='return displayactorgroupFunc(this.id);'&gt;Actor1&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;&lt;hr/&gt;
  </code></pre>
  
  <p>Css:</p>
  
  <pre><code>#headerBlock{
      display: block;
  }
  #inner {
       padding:10px;
       display:block;
       float: left;
  }
  #inner a{
       display:inline-block;
       padding-left:20px;
       line-height:20px;
       color:#808000;
       font-size:14px;
       text-decoration: none;
  }
  </code></pre>