Свойство CSS padding-inline-end

Предыдущая страница padding-inline
Следующая страница padding-inline-start

Определение и использование

элемента padding-inline-end означает пространство от края элемента до содержимого в конце inline.

CSS padding-inline и padding-block attribute связаны с CSS attribute padding-top,padding-bottom,padding-left и padding-right очень похож, но padding-inline и padding-block Attribute зависит от направления inline и блока.

Примечание:связанные CSS attribute writing-mode и direction Определяет направление inline. Это влияет на положение начала и конца элемента в направлении inline, а также padding-inline-end Результат attribute. Для английских страниц, блоковое направление направлено вниз, а направление inline направлено слева направо.

Пример

Пример 1

Установить отступ в конце inline направления:

div {
  padding-inline-end: 50px;
}

Попробуйте сами

Пример 2

Установить значение attribute для элемента <div> writing-mode Когда значение attribute установлено в vertical-rl, направление inline направлено вниз. В результате положение конца элемента перемещается от правого края к низу:

div {
  writing-mode: vertical-rl;
  padding-inline-end: 100px;
}

Попробуйте сами

Пример 3

Установить значение attribute для элемента <div> direction Когда значение attribute установлено в rtl, направление inline направлено слева направо. В результате положение конца элемента перемещается от правого края к левому:

div {
  direction: rtl;
  padding-inline-end: 100px;
}

Попробуйте сами

CSS синтаксис

padding-inline-end: auto|value|initial|inherit;

Значение атрибута

Значение	Описание
auto	Значение по умолчанию. Указывает на значение по умолчанию для padding-inline-end элемента.
length	Указать расстояние в px, pt, cm и других единицах измерения. Отрицательные значения не допускаются. См.:Единицы CSS.
%	Указать процентное расстояние по отношению к размеру родительского элемента в направлении inline.
initial	Этот атрибут устанавливается в значение по умолчанию. См.: initial.
inherit	Этот атрибут наследуется от родительского элемента. См.: inherit.

Технические детали

Значение по умолчанию:	auto
Ингеритация:	Нет
Создание анимации:	Поддерживается. См.:Атрибуты, связанные с анимацией.
Версия:	CSS3
JavaScript синтаксис:	object.style.paddingInlineEnd="100px"