如何獲得橫幅狀的頁腳？

Question

我的頁腳有一個背景，但我不能讓它有一個堅實的黑色矩形。黑色只會圍繞我的文字，而不是我的包裝div或我的頁腳。

.footer { 
 
    color: #FFF; 
 
    background-color: #000; 
 
} 
 

 
.DIV37n5 { 
 
    float: left; 
 
    width: 37.5%; 
 
}

<footer class="footer"> 
 
    <div class="Wrapper"> 
 
    <div class="DIV12n5"> 
 
     <table width="20%" border="1" class="InfoTbl"> 
 
     <tr> 
 
      <th scope="col">Public Sources of Info</th> 
 
     </tr> 
 
     <tr> 
 
      <td><a href="https://wikileaks.org/">WikiLeaks</a></td> 
 
     </tr> 
 
     <tr> 
 
      <td><a href="https://kongregate.com/">And if ya get 
 
       bored</a> 
 
      </td> 
 
     </tr> 
 
     </table> 
 
    </div> 
 
    <div class="DIV50"> 
 
     <p class="PromiseTxt" align="right">This organization is a nonprofit organization dedicated to the spread of knowledge. Remember to always double-check your sources because even we 
 
     <strong>aren't</strong> perfect! 
 
     </p> 
 
    </div> 
 
    <div class="DIV37n5"> 
 
     <p class="PromiseTxt" align="center"> Updated about 1 minute ago 
 
     </p> 
 
    </div> 
 
    </div> 
 
</footer>

那些.DIV類都是相同的，與浮動：根據規定的數字左和寬度。

Answer 1

因爲你有一個浮動，清除它

DEMO HERE

HTML

<footer class="footer"> 
    <div class="Wrapper"> 
    <div class="DIV12n5"> 
     <table width="20%" border="1" class="InfoTbl"> 
     <tr> 
      <th scope="col">Public Sources of Info</th> 
     </tr> 
     <tr> 
      <td><a href="https://wikileaks.org/">WikiLeaks</a></td> 
     </tr> 
     <tr> 
      <td><a href="https://kongregate.com/">And if ya get 
      bored</a> 
      </td> 
     </tr> 
     </table> 
    </div> 
    <div class="DIV50"> 
     <p class="PromiseTxt" align="right">This organization is a nonprofit organization dedicated to the spread of knowledge. Remember to always double-check your sources because even we 
     <strong>aren't</strong> perfect! 
     </p> 
    </div> 
    <div class="DIV37n5"> 
     <p class="PromiseTxt" align="center"> Updated about 1 minute ago 
     </p> 
    </div> 

    <div style="clear:both;"></div> 
    </div> 
</footer>