CSS border-inline-end-width Property

Description

The border-inline-end-width CSS property is used to specify the width of the border on the "end" inline side of an element, which depends on the writing mode of the text. In horizontal writing modes like English (left-to-right), this property corresponds to the right border, while in vertical writing modes, it could represent the bottom border. It allows web developers to precisely control the thickness of this specific border edge, making it a useful tool for creating custom and responsive designs tailored to different text orientations and layouts on a webpage.

Initial value
medium
Applies to
all elements
Inherited
no
Computed value
absolute length; 0 if the border style is none or hidden
Animatable
by computed value type
JavaScript syntax
object.style.borderInlineEndWidth

Syntax

border-inline-end-width: <border-width>

Values

  • <border-width>Specifies the width of the border

Example

<div>This is a box with a border around it.</div>
div {
  background-color:#eee;
  color:#8b008b;
  padding:.75em;
  width:300px;
  height:100px;
  border-inline-end: dashed red;
  border-inline-end-width: 8px
}

Browser Support

The following table will show you the current browser support for the CSS border-inline-end-width property.

Desktop
Edge Chrome Firefox Opera Safari
7969415612.1
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview
69414812.21069

Last updated by CSSPortal on: 23rd September 2023