Positionnement des éléments en CSS

Flux de positionnement

Positionnement dans le flux

Par défaut, le positionnement des objets s’effectue de manière dite statique, ou dans le flux. Cela implique que :

• les éléments en ligne s’enchaînent à la suite, autant que possible sur la même ligne.
• les éléments de type bloc se positionnent les uns en dessous des autres, les marges externes supérieures et inférieures étant fusionnées.

Par défaut, les éléments ont pour hauteur celle de tous les éléments dans le flux qu’ils contiennent, et 0 si ils sont vides ou ne contiennent que des éléments hors du flux. La largeur par défaut des élements dépend de leur type : pour les éléments de type bloc, il s’agit de celle de le élément parent, alors que pour les éléments en ligne, il s’agit de celle de leur contenu.

Syntaxe CSS 3, sélecteurs et propriétés usuelles

Syntaxe de CSS 3

Une feuille de style CSS 3 se compose d’un ensemble de blocs. Ces blocs sont introduits par un sélecteur qui précise à quels éléments HTML il s’applique, puis d’une ou plusieurs déclarations. Une déclaration est une propriété choisie parmi celles de la norme CSS 3, suivie d’une valeur :

selecteur-1 {
    propriete-1: valeur;
    propriete-2: valeur;
}

selecteur-2 {
    propriete-3: valeur;
}

De manière générale, CSS fonctionne avec une notion d’héritage : si un élément est inclus dans un autre, il hérite de toutes les règles de style qui l’affecte.