Innfelt-blokk-ende - CSS-triks

inset-block-ender en logisk CSS-egenskap som angir lengden et element skal forskyves i blokkretningen fra sluttekanten. Det er som å erklære, bottombortsett fra at sluttpunktet bestemmes av elementets direction, text-orientationog writing-modeakkurat som andre logiske egenskaper.

Eiendommen er en del av CSS Logical Properties and Values Level 1-spesifikasjonen som for øyeblikket er i Editor's Draft-status. Det betyr at definisjonen og informasjonen om den kan endres mellom nå og offisiell anbefaling.

.element ( inset-block-end: 50px; position: relative; /* Apples to positioned elements */ writing-mode: vertical-rl; /* Determines the block start direction */ )

Så, for eksempel, hvis skrivemodus er satt til horizontal-lrden inset-block-endeiendommen vil fungere akkurat som bottomog stille elementet er forskjøvet fra den nederste kanten. Du må til og med spesifisere et eksplisitt positionpå det samme elementet for at det skal tre i kraft, akkurat som bottomog andre fysiske forskyvningsegenskaper.

Men endre elementets writing-modetil noe sånt, vertical-lrog den "nederste" kanten roteres i vertikal retning, og virker mer som rightegenskapen.

Syntaks

inset-block-end: ;

Opprinnelig verdi: auto
Gjelder: posisjonerte elementer
Arvet: nei
Prosentandel: som for den tilsvarende fysiske egenskapen
Beregnet verdi: samme som tilsvarende bottomeiendom
Animasjonstype: etter beregnet verditype

Verdier

inset-block-endtar en lengdeverdi og støtter globale søkeord. Standardverdien er auto.

/* Length values */ inset-block-end: 50px; inset-block-end: 4em; inset-block-end: 3.5rem inset-block-end: 25vh; /* Percentage values */ inset-block-end: 50%; /* Keyword values */ inset-block-end: auto; /* initial value */ /* Global values */ inset-block-end: initial inset-block-end: inherit; inset-block-end: unset;