title: CSS: Why are descendant elements removed from parent block?
body: <p>In my code below, the bottom border of the "question-content" div does not appear at the bottom; it actually cuts through the "li" elements. Analyzing this in Firebug shows that the li class="tag" descendant elements are no longer included in the "question-content" parent block.</p>
  
  <p>How should I fix this? Thanks.</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
     &lt;style type="text/css"&gt;
      .question-block {
          margin: 10px 10px 0;
          padding-bottom: 20px;
      }
      .question-block .question-content {
          margin: 0 0 10px 55px;
          padding: 0 0 20px 0;
          width: 545px;
          border-bottom: 1px solid gray;
      }
      .question-content h1 {
          font-size: 20px;
          line-height: 22px;
          margin: 0 0 10px 0px;
      }
      .question-content .question-details {
          margin-left: 30px;
          font-size: 14px;
      }
      .question-content .links {
          margin-left: 30px;
          padding: 0px;
          list-style-type: none;
      }
      .tag {
  float: left;
  margin: 5px 4px 0;
  font-size: 14px;
      }
      .tag a {
      display: block;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
      border: 1px;
  border-radius: 4px;
  height: 20px;
  color: #000;
  background: #C5C5C5;
      padding: 3px 0 0 0;
  width: 81px;
  text-align: center;
      }
     &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class="question-block"&gt;      
          &lt;div class="question-content"&gt;
              &lt;h1&gt; Question &lt;/h1&gt;
              &lt;div class="question-details"&gt; Question details &lt;/div&gt;
              &lt;ul class="links"&gt;
                   &lt;li class="tag"&gt;&lt;a href="#"&gt;tag 1&lt;/a&gt;&lt;/li&gt;
                   &lt;li class="tag"&gt;&lt;a href="#"&gt;tag 2&lt;/a&gt;&lt;/li&gt;
                   &lt;li class="tag"&gt;&lt;a href="#"&gt;tag 3&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
         &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>