Pour positionner ton bloc de contenu, tu aurais également pu te passer de comportement flottant et utiliser un contexte de formatage de bloc, créé par la propriété
overflow :
#centreDroit {
margin: 10px 0 0 8px;
width:848px;
overflow: hidden;
background-color: #FF0000;
}
Non seulement le bloc #centreDroit ne se glissera plus sous le flottant de gauche (le menu), mais en plus le contexte de formattage empêchera les éléments flottants enfant de #centreDroit de sortir du flux de leur bloc parent.
Ensuite, on utilise des marges plutôt que le positionnement relatif pour décaler le bloc.
Pour information, c'est le positionnement relatif qui créait le chevauchement de dix pixels entre le bloc de contenu et le pied de page : le pied de page se positionnait
en fonction de la place dans le flux du bloc #centreDroit, et non pas en fonction de sa place sur la page une fois décalé de sa position normale par un positionnement relatif.
Cf. sur le positionnement relatif :
http://openweb.eu.org/articles/initiation_flux/
Si tu veux garder le comportement flottant pour le bloc de contenu, tu peux également te contenter de supprimer le positionnement relatif et de corriger avec des marges :
#centreDroit {
margin: 10px 0 10px 8px;
width:848px;
float:left;
background-color: #FF0000;
}
