# padding-inline-end property

The `padding-inline-end` property specifies the end padding of an element along the inline (horizontal) axis.

## Syntax

`selector { padding-inline-end: size; }`

## Example

Let's set the inline-axis ending padding of the child element to `20px`:

`<div> <p>text</p> </div>` `div { width: 400px; height: 200px; border: 1px solid black; } p { padding-inline-end: 20px; width: 100px; height: 50px; border: 1px solid red; }`

:

## Example

Now let's set the end padding of the child element on the inline axis to `20%`:

`<div> <p>text</p> </div>` `div { width: 400px; height: 200px; border: 1px solid black; } p { padding-inline-end: 20%; width: 100px; height: 50px; border: 1px solid red; }`

:

## See also

- the `padding-inline-start` property
  that specifies the start padding of an element along the inline axis
- the `padding-block-end` property
  that specifies the end padding of an element along the block axis
- the `padding-block-start` property
  that specifies the start padding of an element along the block axis
- the `padding` property
  that sets a padding
- the `margin-bottom` property
  that sets a bottom margin
- the `margin-left` property
  that sets a left margin
- the `margin-right` property
  that sets a right margin
- the `margin` property
  that is a shorthand for a margin

← →
↑
en ru