CSS border-inline-end-style property
Description
CSS border-inline-end-style is a logical property that defines style for the end side of a block. The selection of end side depends upon the writing-mode.
The end side represents right side for the horizontal-tb writing-mode.
The end side represents bottom or top side for the vertical-lr or vertical-rl writing-mode respectively.
Change the direction of flow of text.
horizontal-tb vertical-lr vertical-rl
Syntax
border-inline-end-style : none | hidden | dashed | solid | dotted | double | ridge | groove | inset | outset
Property values
noneDefault
-
There is no style. In this case, the color and width of border are also ignored i.e. 0px border.
border-inline-end-style: none;
hidden
-
It is same as 'none' but resolve to different results for the border-collapse property in tables.
border-inline-end-style: hidden;
dashed
-
The border consists of a series of square shaped dashes.
border-inline-end-style: dashed;
dotted
-
The border consists of a series of round dots.
border-inline-end-style: dotted;
solid
-
The border consists of a solid line.
border-inline-end-style: solid;
double
-
The border consists of two lines. The total border-width equals to the two lines and space between them.
border-inline-end-style: double;
ridge
-
The content seems to be coming out of the canvas. The half outer side of border is darker than border-block-end-color.
border-inline-end-style: ridge;
groove
-
The content seems to be going into the canvas. The half inner side of border is darker than border-block-end-color.
border-inline-end-style: groove;
Applicable to
It applies to all elements
From web4college, the free CSS digger
Bookmark this page
Ctrl+D
