Margina-blok-kraj - CSS-trikovi

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

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

Nastavak rub bloka smjeru određuje elementa writing-mode, directiona text-orientation. Dakle, kada se koristi margin-block-endu vodoravnom kontekstu slijeva udesno, djeluje baš kao margin-bottomda je početni rub elementa njegovo dno.

Ali ako promijenimo u writing-mode, recimo, okomito, element se rotira, postavljajući krajnji rub udesno. Kao rezultat toga, margin-block-endponaša se baš kao margin-right. U osnovi je početni rub u odnosu na smjer toka. To je ono što mislimo kad govorimo o "logičkim" svojstvima.

Sintaksa

margin-block-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-end prihvaća jednu duljinu ili vrijednost ključne riječi.

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