--- title: inset-block-start slug: Web/CSS/inset-block-start tags: - CSS - Experimental - Propriété - Reference translation_of: Web/CSS/inset-block-start original_slug: inset-block-start ---
La propriété inset-block-start
définit le début du décalage logique en bloc (block) d'un élément, selon le mode d'écriture, la directionnalité et l'orientation. Elle correspond à une des propriétés parmi {{cssxref("top")}}, {{cssxref("right")}}, {{cssxref("bottom")}} ou {{cssxref("left")}} selon les valeurs des propriétés {{cssxref("writing-mode")}}, {{cssxref("direction")}} et {{cssxref("text-orientation")}}.
Note : Avant Firefox 63, cette propriété était implémentée avec le nom offset-block-start
. Firefox 63 a mis à jour son implémentation afin de suivre les modifications apportées à la spécification.
/* Valeurs de longueur */ /* Type <length> */ inset-block-start: 3px; inset-block-start: 2.4em; /* Valeurs relatives à la largeur */ /* du bloc englobant */ /* Type <percentage> */ inset-block-start: 10%; /* Valeurs avec un mot-clé */ inset-block-start: auto; /* Valeurs globales */ inset-block-start: inherit; inset-block-start: initial; inset-block-start: unset;
La propriété inset-block-start
peut prendre les mêmes valeurs que la propriété {{cssxref("left")}}.
{{csssyntax}}
<div> <p class="exemple">Texte pour l'exemple</p> </div>
div { background-color: yellow; width: 120px; height: 120px; } .exemple { writing-mode: vertical-lr; position: relative; inset-block-start: 20px; background-color: #c8c800; }
{{EmbedLiveSample("Exemples", 140, 140)}}
Spécification | État | Commentaires |
---|---|---|
{{SpecName("CSS Logical Properties", "#propdef-inset-block-start", "inset-block-start")}} | {{Spec2("CSS Logical Properties")}} | Définition initiale. |
{{cssinfo}}
{{Compat("css.properties.inset-block-start")}}