Margin-inline-end - CSS-trikovi

margin-inline-endNekretnina u CSS definira količinu prostora uz vanjski završna ruba elementa u smjeru inline. Uključen je u specifikaciju CSS logičkih svojstava razine 1, koja je trenutno u radnom nacrtu.

.element ( margin-inline-end: 25%; writing-mode: vertical-lr; )

Nastavak rub u smjeru inline određuje elementa writing-mode, directiona text-orientation. Dakle, kada se koristi margin-inline-endu vodoravnom kontekstu slijeva udesno, djeluje baš kao margin-rightda je završni rub elementa desna strana.

Ali ako promijenimo u writing-mode, recimo, okomito, element se okreće u smjeru kazaljke na satu, postavljajući krajnji rub prema dnu. Kao rezultat toga, margin-inline-endponaša se baš kao margin-bottom. U osnovi je početni rub u odnosu na smjer toka. To je ono što mislimo kad govorimo o "logičkim" svojstvima.

Sintaksa

margin-inline-end:

Nekako je čudno vidjeti sintaksu jednog svojstva koja upućuje na sintaksu drugog CSS svojstva točno u dokumentaciji, ali to je stvarno ono što jest. Ono što se u osnovi pokušava reći jest da svojstvo prihvaća iste vrijednosti kao margin-topšto slijede ovu sintaksu:

margin-top: | | auto;

Početna vrijednost: 0
Primjenjuje se na: sve elemente, osim na unutarnje elemente tablice, rubinske osnovne spremnike i rubin-bilješke
Naslijeđeno: ne
Procenti: kao za odgovarajuće fizičko svojstvo
Izračunata vrijednost: isto kao i odgovarajuća margin-*svojstva
Vrsta animacije: prema izračunatoj vrsti vrijednosti

Vrijednosti

margin-block-start prihvaća jednu duljinu ili vrijednost ključne riječi.

/* Length values */ margin-inline-end: 20px; margin-inline-end: 2rem; margin-inline-end: 25%; /* Keyword values */ margin-inline-end: auto; /* Global values */ margin-inline-end: inherit; margin-inline-end: initial; margin-inline-end: unset;