CSS border-inline-end Property

The CSS property border-inline-end targets the border on the logical inline-axis at the end edge of an element. It exists to let authors style borders in a writing-mode– and direction–agnostic way, so you can declare borders relative to the text flow rather than fixed physical edges. Using the logical form makes styles more robust when supporting vertical text, different languages, or dynamically flipped directions.

Which physical edge the border-inline-end value affects depends on the element’s text flow and directionality: it maps to the left or right physical side in horizontal writing modes and to the appropriate side in vertical modes. The mapping is governed by the document’s orientation rules, which are in turn determined by properties such as writing-mode and direction. Because it follows the inline axis, changing those properties can move the border to a different physical edge without changing the logical declaration.

border-inline-end participates in the same cascade and specificity rules as other border properties: a statement using this logical longhand will override the corresponding value supplied by a less-specific shorthand. For example, declarations made with the generic border shorthand can be overridden by a later border-inline-end declaration, and vice versa depending on origin and specificity. It also composes conceptually from the same underlying border characteristics - style, width, and color - even though you may set those with other longhands or shorthands.

In practice, this logical border behaves like other borders in painting, hit-testing, and layout: it contributes to the element’s visual edge, participates in box-model calculations, and will be affected by interactions such as collapsing borders in table contexts or clipping by overflow. Because it is a logical property, it simplifies authoring responsive and internationalized UIs: you can apply a border “at the inline end” once and have it appear correctly across writing modes and language directions without changing selectors or duplicating rules.