CSS border-inline-width Property
Description
The border-inline-width
CSS property is used to specify the width of the inline borders of an element, which are the borders that run along the inline axis of text or inline-level elements. It allows web developers to control the thickness of these borders, which can be useful for styling elements like inline links or inline text highlights. This property complements the more common border-width property, which controls the width of borders along the block axis. By adjusting border-inline-width, designers can achieve finer control over the visual presentation of inline content 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.borderInlineWidth
Interactive Demo
Inline Width Property
Syntax
border-inline-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: dashed red;
border-inline-width: 8px
}
Browser Support
The following table will show you the current browser support for the CSS border-inline-width
property.
Desktop | |||||
87 | 87 | 66 | 73 | 14.1 |
Tablets / Mobile | |||||
87 | 66 | 62 | 14.5 | 14 | 87 |
Last updated by CSSPortal on: 1st January 2024