Les clefs du positionnement CSS

Ce billet date de plusieurs années, ses informations peuvent être devenues obsolètes.

Ce matin un post sur la liste des pompeurs m'a donné l'occasion de faire un résumé des bases du positionnement CSS en 3 points. Tout cela se passe en mode strict :

1- Je pense que la première étape pour bien s'en sortir avec le positionnement CSS est de bien comprendre la différence entre les éléments qui ont un affichage dans le navigateur de type bloc et les éléments qui ont un affichage de type en ligne. Après y a moyen de changer leur type de rendu avec display. Plus d'infos ici : http://openweb.eu.org/articles/initiation_display/

2- Ensuite il faut savoir que normalement la largeur totale d'un élément = width + padding + border + margin.

3- La 3ème étape c'est d'apprendre à positionner les éléments avec les positions relatives, float, absolues et fixe. Voir cet article et les suivants : http://openweb.eu.org/articles/initiation_flux/

La propriéte clear peut rendre beaucoup de services. Denis de Cybercodeur a donné ce lien en complément : http://www.brainjar.com/css/positioning/. Une fois ces concepts assimilés, tout le monde est apte à faire une mise en page CSS.

Avant Quoi de neuf ? Après Web et téléphone portable

Tag Kemar Joint