CSS hakkında öğrendiğin en ilginç son gerçek hakkında bana anlat.

CSS'te çok ilginç bir özellik ortaya çıktı — Container Queries (Kapsayıcı Sorguları). Bunlar, stilleri yalnızca tarayıcı penceresinin boyutuna göre değil, aynı zamanda ebeveyn kapsayıcısının boyutuna göre de uygulamaya olanak tanır. Bu, kullanıldıkları yere bağlı olarak görünümünü değiştirebilen uyumlu bileşenler oluşturmak için özellikle faydalıdır ve sadece ekran genişliğine bağlı değildir.

Kullanım örneği:

.card {
  container-type: inline-size;
}

@container (min-width: 400px) {
  .card {
    background-color: lightblue;
  }
}

Burada .card, bir kapsayıcı haline gelir ve içinde stil değişiklikleri, kapsayıcının genişliği 400px'ten büyükse gerçekleşir. Bu, modüler ve uyumlu tasarım için yeni olanaklar açar.