📖 Konumlandırma (Positioning)
position: sticky (Kaydırmaya Bağlı Sabitlenen Başlıklar)
Öğe belirli bir kaydırma (scroll) eşiğine ulaşana kadar göreceli (relative), eşiğe ulaştıktan sonra sabit (fixed) davranır.
⚡ Sözdizimi (Syntax)
position: sticky; top: 0;
🛠️ Pratik Kullanım Örnekleri
📌 Sayfanın Üstüne Sabitlenen Header Menüsü
.header {
position: sticky;
top: 0;
z-index: 50;
backdrop-filter: blur(12px);
}
💡
Mühendislik İpucu & En İyi Pratik:
Ebeveyn (parent) öğelerden birinde `overflow: hidden` tanımlıysa `sticky` çalışmaz!
İlgili Kılavuzlar
display: flex (Esnek Kutu Düzeni - Flexbox)
display: grid (İki Boyutlu CSS Izgara Düzeni)
position: sticky (Kaydırmaya Bağlı Sabitlenen Başlıklar)
backdrop-filter (Buzlu Cam & Glassmorphism Efekti)
clamp() (Akıcı Tipografi ve Dinamik Boyutlandırma)
:has() Ebeveyn Seçici (Parent Selector)
aspect-ratio (En-Boy Oranı Kilitleme)