Hello everyone, here I have this CSS:

#header{ background-color: black; height: 40px; color: white; width: auto; } #footer{ margin-top: 0px; background-color: black; width: 100%; } #left{ float: left; border-right: 2px; border-color: black; border-style: solid; overflow: hidden; display: block; } #container{ margin: auto; border: 2px; border-color: black; border-style: solid; width: 600px; height: auto; } 

Next HTML code:

 <html> <div id="container"> <div id="header"> <?php include("block/header.php"); ?> <b><font color= "white">Привет</font></b> </div> <div id="left"> <?include("block/left.php"); ?> </div> <div id="footer"> <?include("block/footer.php"); ?> </div> </div> </html> 

But for some reason it does not work: (This is how my site looks

Alt text

    3 answers 3

    Try footer to add the property "clear: both"

    • Great, it worked. - Csharp
      #footer{clear:both;} 

    Cleaning flow

    There are different ways to clean the stream that you just need to know !! Clearfix - clearing the stream while maintaining the structural layout .

    • Thanks, everything works as it should!) - Csharp

    This problem occurred because you applied float: left; In this case, to correct the situation, either remove the float and set the width (fixed width) or, as @nMike advised , add clear: both;