Margin-block-end - CSS Hileleri

CSS'deki margin-block-endözellik, blok yönündeki bir öğenin dış bitiş kenarı boyunca boşluk miktarını tanımlar. Şu anda Çalışma Taslağında bulunan CSS Mantıksal Özellikleri Seviye 1 spesifikasyonuna dahil edilmiştir.

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

Blok yönünde bitiş uç elemanı 's belirlenir writing-mode, directionve text-orientation. Dolayısıyla, margin-block-endsoldan sağa yatay bir bağlamda kullanıldığında, tıpkı margin-bottomöğenin başlangıç kenarı altta olduğu gibi davranır .

Ancak writing-modedikey olarak değiştirirsek, eleman döndürülür, bitiş kenarı sağa doğru yerleştirilir Sonuç olarak, aynı şekilde margin-block-enddavranır margin-right. Temel olarak, başlangıç kenarı aktığı yöne bağlıdır. "Mantıksal" özelliklerden bahsederken kastettiğimiz budur.

Sözdizimi

margin-block-end:

Bir özelliğin sözdiziminin doğrudan dokümantasyonda başka bir CSS özelliğinin sözdizimine başvurduğunu görmek biraz tuhaf, ama gerçekte olan bu. Temel olarak söylemeye çalıştığı şey, mülkün margin-topbu sözdizimini izleyen aynı değerleri kabul ettiği :

margin-top: | | auto;

Başlangıç değeri: 0
Şunlar için geçerlidir: dahili tablo öğeleri, yakut temelli kaplar ve yakut detaylandırma kutuları hariç tüm öğeler
Devralındı: hayır
Yüzdeler: karşılık gelen fiziksel özellik için
Hesaplanan değer: karşılık gelen margin-*özelliklerle aynı
Animasyon türü: hesaplanan değer türüne göre

Değerler

margin-block-end tek bir uzunluk veya anahtar kelime değerini kabul eder.

/* 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;