Własność CSS padding-inline-end ustawia szerokość logicznego dopełnienia końcowego w orientacji śródliniowej. Jest to własność niedziedziczona.
Ustawienie własności padding-inline-end
jest odwzorowywane na odpowiednią własność fizyczną dopełnienia zależnie od kierunku i orientacji pisma. W przypadku dokumentów w językach pisanych od lewej strony i od góry (takich jak polski, angielski itd.) ta własność odpowiada własności padding-right
, np.:
W tym przykładzie zdefiniowaliśmy końcowe logiczne dopełnienie śródliniowe o szerokości 20 pikseli oraz ustawiliśmy kierunek pisma poziomego od góry do dołu (jak w języku polskim). Efekt tego jest taki:
Jak widać dopełnienie zostało zastosowane po prawej stronie, ponieważ to jest logiczny koniec elementu w orientacji śródliniowej, i odpowiada mu własność padding-right
.
A teraz tę samą deklarację własności padding-inline-end
zastosujemy do tekstu pionowego, pisanego od prawej do lewej.
Efekt:
W tym przypadku dopełnienie również zostało zastosowane na logicznym końcu, ale zmieniła się orientacja elementu i stąd też zmiana lokalizacji obszaru dopełnienia. Teraz własność padding-inline-end
odpowiada własności padding-bottom
.
Obsługiwane wartości
Typy wartości przyjmowane przez własność padding-inline-end
:
- Liczba z jednostką długości
- Procenty – wartości procentowe odnoszą się do szerokości lub wysokości (zależnie od kierunku i orientacji pisma) nadrzędnego elementu blokowego, czyli zawierającego ten element, dla którego jest zdefiniowane dopełnienie.
Wartość początkowa własności padding-inline-end
to 0
.
Składnia
Własność padding-inline-end
przyjmuje jedną wartość określającą szerokość logicznego dopełnienia końcowego w orientacji śródliniowej, np.:
W powyższym przykładzie końcowe dopełnienie śródliniowe będzie miało szerokość 10 pikseli.
Zastosowanie
Własność padding-inline-end
ma zastosowanie do wszystkich elementów z wyjątkiem wewnętrznych elementów tabeli, nie licząc komórek, a więc tych, które mają własność display
ustawioną na table-row-group
, table-header-group
, table-footer-group
, table-row
, table-column-group
lub table-column
. Standardowo zaliczają się do nich elementy tr
, th
, tfoot
, colgroup
, col
, thead
i tbody
.
Podsumowanie
Zastosowanie | Wszystkie elementy z wyjątkiem tych, które mają własność display ustawioną na table-row-group , table-header-group , table-footer-group , table-row , table-column-group lub table-column |
---|---|
Obsługiwane wartości |
|
Wartość początkowa | 0 |
Dziedziczenie | Nie |
Specyfikacja | CSS Logical Properties and Values Level 1 – padding-inline-end |