Margin-block-start - CSS-triki

margin-block-startHotel v CSS določa količino prostora vzdolž zunanje začetne robu elementa v smeri bloka. Vključen je v specifikacijo CSS Logical Properties Level 1, ki je trenutno v delovnem osnutku.

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

Začetni rob v smeri blok opredeljujejo ih elementov writing-mode, directionin text-orientation. Torej, pri uporabi margin-block-startv vodoravnem kontekstu od leve proti desni deluje tako, kot margin-topda je začetni rob elementa njegov vrh.

Če pa spremenimo v writing-moderecimo navpično, se element zasuka in postavi začetni rob proti levi. Posledično se margin-block-startobnaša tako kot margin-left. V bistvu je začetni rob glede na smer, v katero teče. To imamo v mislih, ko govorimo o "logičnih" lastnostih.

Sintaksa

margin-block-start:

Nekako čudno je videti, kako se sintaksa ene lastnosti v dokumentaciji sklicuje na sintakso druge lastnosti CSS, toda res je to. V bistvu poskuša reči, da lastnost sprejema enake vrednosti, kot margin-topsledi tej sintaksi:

margin-top: | | auto;

Začetna vrednost: 0
Velja za: vse elemente, razen notranjih elementov tabele, ruby osnovnih vsebnikov in ruby zabeležk
Podedovano: ne
Odstotki: kot za ustrezno fizično lastnost
Izračunana vrednost: enako kot ustrezne margin-*lastnosti
Vrsta animacije: po izračunani vrednosti

Vrednote

margin-block-start sprejme eno dolžino ali vrednost ključne besede.

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