La couleur d'arrière-plan et l'image ne fonctionnent pas avec la hauteur du diviseur externe automatique

Question

<style> 
body{ 
    color:red; 
    } 
.wrapper{ 
    width:900px; 
    height:auto; 
    padding:0px; 
    margin:auto; 
    background:#000000; 
    } 
.header{ 
    width:900px; 
    height:200px; 
    float:left; 
    padding:0px; 
    margin:0px; 
    } 
.body_content{ 
    width:900px; 
    height:200px; 
    float:left; 
    padding:0px; 
    margin:0px; 
    } 
.fotter{ 
    width:900px; 
    height:150px; 
    float:left; 
    padding:0px; 
    margin:0px 0px 25px 0px; 
    } 
</style>  



<div class="wrapper"> 
<div class="header">Header</div> 
<div class="body_content">Body Content</div> 
<div class="fotter">Fotter Content</div> 
</div> 

Answer 1

Vous avez oublié clear vos flotteurs.

<div class="wrapper"> 
    <div class="header">Header</div> 
    <div class="body_content">Body Content</div> 
    <div class="fotter">Fotter Content</div> 
    <br style="clear: both;" /> <!-- Google "clear floats" for a few different ways to clear your floats. --> 
</div> 

This est son problème, et this est sa solution.

P.S. Il est écrit bas de page :)