Bu sitedeki her şey Sevgi ile kodlanmıştır.

Kategori Listesini Göster

CSS ile Sabit Konumlandırma Nasıl Yapılır?


FacebookTwitterPinterestTumblrYazdır


CSS ile ilgili birtakım püf noktaları paylaşmaya devam ediyoruz. Geçtiğimiz günlerde, bir "div elementi"ni sol üst köşeye nasıl sabitleyeceğime dair birtakım kodlar deniyordum ve sizlerin de zaman zaman bu yönde ihtiyaçları olabileceği aklıma geldi. Dolayısı ile CSS yardımı ile elementleri dilediğimiz gibi konumlandırabiliriz. Böylelikle, ilgili elementler bizlerin belirlediği konumda sabit olarak bulunmaya devam eder. Birkaç örneğe göz atalım ve konuyu daha iyi kavrayalım.

CSS ile Konumlandırma İşlemi

1) Bir elementi, sol üst köşeye sabitlemek için örnek CSS kodu aşağıdaki gibidir.

.sol-ust {
position: fixed;
left: 0px;
top: 0px;
}

HTML bölümüne ise aşağıdaki gibi bir kod ekleyebiliriz.

<div class="sol-ust">Sol üst köşede yer alan sabit bir yazı.</div>

2) Bir elementi, sağ üst köşeye sabitlemek için örnek CSS kodu aşağıdaki gibidir.

.sag-ust {
position: fixed;
right: 0px;
top: 0px;
}

HTML bölümüne ise aşağıdaki gibi bir kod ekleyebiliriz.

<div class="sag-ust">Sağ üst köşede yer alan sabit bir yazı.</div>

Not: Üst köşe yerine alt köşeye eklemek için, "top" yerine, "bottom" kodunu kullanabilirsiniz.


  1. Yorum bulunmamaktadır.

Bu yazıya yorum göndermek ister misiniz?

Dikkat: Her yorum gönderen kişi, kendi gönderdiği yorumdan sorumlu olmaktadır.
Not: Yazı ile herhangi bir ilgisi bulunmayan yorumların onaylanmadığını belirtmek isteriz.
Yukarı Çık