padding-inline-end#

#Introduction

Defines the logical inline end padding of an element, which maps to a physical padding depending on the element's direction. Must be nonnegative.

In LTR mode, padding-inline-end taking the same values as the padding-right. In RTL mode, padding-inline-end taking the same values as the padding-left.

#Examples

css-apisrc/padding-inline-end/App.tsx

Code

Preview

#Syntax

/* <length> values */
padding-inline-end: 0.5em;
padding-inline-end: 0px;
padding-inline-end: 2rpx;

/* <percentage> value */
padding-inline-end: 10%;

#Values

#0px

Default value.

#<length>

The size of the padding as a fixed value. Must be nonnegative.

#<percentage>

The size of the padding as a percentage, relative to the inline size (width) of the containing block.

#Formal definition

#Formal syntax

padding-inline-end =
  <length-percentage [0,∞]>

<length-percentage> =
  <length>      |
  <percentage>

#Difference with the Web

1. writing mode is not supported in Lynx.

#Compatibility