v2.4.0
Giriş yap

CSS inset Özelliği

Sonunda position ile kullanabileceğimiz bir kısa kullanım için inset özelliği geldi. Bu sayede artık top left right bottom değerlerini tek bir özellikte tanımlayabilirsiniz.

Örneğin şöyle bir yapıyı;

div {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

artık şöyle yazabilirsiniz

div {
    position: absolute;
    inset: 0;
}

tıpkı margin ve padding özellikleri gibi saat yönünde ikili, üçlü ya da dörtlü tanım yapabilirsiniz. Örneğin;

div {
    position: absolute;
    inset: 10px; /* top/right/bottom/left */
    inset: 10px 20%; /* top/bottom -- right/left */
    inset: 10px 20% 3em; /* top -- right/left -- bottom */
    inset: 10px 15px 20px 25px; /* top -- right -- bottom -- left */
}

Tarayıcı Desteği

Şu an için IE ve Edge hariç tüm modern tarayıcılar desteklemektedir.
https://caniuse.com/?search=inset

tayfunerbilen
11 gün önce yazdı - 329 kez görüntülendi.
Önceki CSS @container Sorguları