CSS Logical Properties

CSS Logical Properties (les propriétés logiques CSS) est un module CSS qui définit une correspondance logique vers les propriétés physiques de contrôle de la mise en page selon le sens de lecture et l'orientation du texte. On aura deux directions logiques : block et inline, perpendiculaires, qui dépendent du sens de l'orientation du document.

Ce module définit également les propriétés logiques et les valeurs pour les propriétés précédemment définies avec CSS 2.1. Les propriétés logiques sont des propriétés dont l'orientation est relative au mode d'écriture du document et possèdent des propriétés physiques équivalentes.

Dimension de bloc ou de ligne

Les propriétés et valeurs logiques utilisent les termes abstraits bloc (block) ou ligne (inline) afin de décrire leur direction. La signification physique de ces termes dépend du mode d'écriture.

Dimension de bloc: C'est la dimension perpendiculaire au flux du texte sur une ligne. Autrement dit, il s'agit de la dimension verticale lorsque le texte est écrit dans un mode horizontal et de la dimension horizontale lorsque le texte est écrit verticalement (pour le français, cette dimension correspond donc à l'axe vertical).
Dimension en ligne: C'est la dimension parallèle au flux du texte sur une ligne. Autrement dit, il s'agit de la dimension horizontale lorsque le texte est écrit dans un mode horizontal et de la dimension verticale lorsque le texte est écrit verticalement (pour le français, cette dimension correspond donc à l'axe horizontal).

Référence

Propriétés relatives au dimensionnement

block-size Expérimental
inline-size Expérimental
max-block-size Expérimental
max-inline-size Expérimental
min-block-size Expérimental
min-inline-size Expérimental

Propriétés relatives aux marges, bordures et remplissages

border-block Expérimental
border-block-color Expérimental
border-block-end Expérimental
border-block-end-color Expérimental
border-block-end-style Expérimental
border-block-end-width Expérimental
border-block-start Expérimental
border-block-start-color Expérimental
border-block-start-style Expérimental
border-block-start-width Expérimental
border-block-style Expérimental
border-block-width Expérimental
border-color (mot-clé logical Expérimental )
border-inline Expérimental
border-inline-color Expérimental
border-inline-end Expérimental
border-inline-end-color Expérimental
border-inline-end-style Expérimental
border-inline-end-width Expérimental
border-inline-start Expérimental
border-inline-start-color Expérimental
border-inline-start-style Expérimental
border-inline-start-width Expérimental
border-inline-style Expérimental
border-inline-width Expérimental
border-start-start-radius Expérimental
border-start-end-radius Expérimental
border-end-start-radius Expérimental
border-end-end-radius Expérimental
border-style (mot-clé logical Expérimental )
border-width (mot-clé logical Expérimental )
margin (mot-clé logical Expérimental )
margin-block Expérimental
margin-block-end Expérimental
margin-block-start Expérimental
margin-inline Expérimental
margin-inline-end Expérimental
margin-inline-start Expérimental
padding (mot-clé logical Expérimental )
padding-block Expérimental
padding-block-end Expérimental
padding-block-start Expérimental
padding-inline Expérimental
padding-inline-end Expérimental
padding-inline-start Expérimental

Propriétés relatives aux flottements et au positionnement

clear (mots-clés inline-end Expérimental et inline-start Expérimental )
float (mots-clés inline-end Expérimental et inline-start Expérimental )
inset Expérimental
inset-block Expérimental
inset-block-end Expérimental
inset-block-start Expérimental
inset-inline Expérimental
inset-inline-end Expérimental
inset-inline-start Expérimental

Autres propriétés

caption-side (mots-clés inline-end Expérimental et inline-start Expérimental )
overflow-block Expérimental
overflow-inline Expérimental
resize Expérimental (mots-clés block Expérimental et inline Expérimental )
text-align (mots-clés end Expérimental et start Expérimental )

Propriétés dépréciées

inset-block-end Non-standard Deprecated (désormais inset-block-end Expérimental )
inset-block-start Non-standard Deprecated (désormais inset-block-start Expérimental )
inset-inline-end Non-standard Deprecated (désormais inset-inline-end Expérimental )
inset-inline-start Non-standard Deprecated (désormais inset-inline-start Expérimental )

Guides

Spécifications

Specification
CSS Logical Properties and Values Level 1

Compatibilité des navigateurs

Pour des informations précises sur chaque propriété, se référer au tableau de compatibilité des pages des propriétés.