CSS border-block-end

The border-block-end property is used to set the border on the end side of a block-level element. This property is part of the CSS Logical Properties specification, which allows you to define properties in a way that is independent of the writing mode.

The syntax for the border-block-end property is as follows:


selector {
  border-block-end: value;
}

Here are some values that can be used with the border-block-end property:

border-block-end-width: sets the width of the border
border-block-end-style: sets the style of the border (e.g. solid, dashed, dotted)
border-block-end-color: sets the color of the border

Let's see an example of how to use the border-block-end property in a CSS stylesheet:


.example {
  border-block-end: 2px solid black;
}

Result:

This is an example of a block-level element with a border on the end side.

In the example above, we set a border on the end side of a block-level element with a width of 2 pixels, a solid style, and a black color.

Remember that the border-block-end property may behave differently depending on the writing mode of the document, so make sure to test it thoroughly in different scenarios.