El HTML:
<!DOCTYPE html>
<html>
<head>
<title>Portal web - aprenderaprogramar.com</title>
<meta charset="utf-8">
<meta name="description" content="Portal web aprenderaprogramar.com">
<meta name="keywords" content="aprender, programar, cursos, libros">
<link rel="stylesheet" type="text/css" href="CSSFlotanteClearejfinal(36).css">
</head>
<body>
<div id="uno"> </div>
<div id="dos"> </div>
<div id="tres"> </div>
<div id="cuatro"> </div>
<div id="cinco"> </div>
<div id="seis"> </div>
<div id="siete"> </div>
<div id="ocho"> </div>
<div id="texto"> Con texto </div>
<div id="nueve"> </div>
<div id="diez"> </div>
<div id="once"> </div>
</br>
<div id="fondo"> Curso CSS aprenderaprogramar.com </div>
</body>
</html>
y el CSS
*{font-family: calibri;}
div {width:50px; height:50px; margin-right:5px; float:left;}
#uno {background-color:green;}
#dos {background-color:blue;}
#tres {background-color:pink;}
#cuatro {background-color:red;}
#cinco {background-color:brown;}
#seis {background-color:yellow;}
#siete {background-color:orange;}
#ocho {background-color:gray;}
#texto {background-color:yellow; margin-top:20px; margin-bottom:20px; width:1920px; height:20px; clear:both;}
#nueve {margin-right:5px; width:200px; height:50px; background-color:green; float:right;}
#diez {margin-right:5px; width:200px; height:50px; background-color:red; float:right;}
#once {margin-right:5px; width:200px; height:50px; background-color:blue; float:right;}
#fondo {background-color:#DEB887; width:1920px; height:20px; clear:both;}