Temalardaki en büyük sorunlardan birisi, sidebar dediğimiz yan menülerin bir anda sitenin altına kayması ve yan tarafın bomboş kalmasıdır. Bunun nedeni yazdığımız yazının içeriğinin taşmasıdır. CSS konumlandırmada kutular yerleşirken varolan genel genişlik aşılınca son kutu aşağıya kayar. Bu sorunda işte bundan kaynaklanıyor. Peki ne yapabiliriz?
Önceki bir  yazımda belirttiğim gibi css’te position özelliğini kullanarak bunu  çözebiliriz.
Position niteliği, kutuların konumlandırmada nasıl davranacağını belirler. Mesela position:absolute dediğimizde kutu normal akıştan çıkar ve bizim belirleyeceğimiz değerlere göre konumlanır. Biraz karışık gibi görünüyor ama örnek verelim.
Normalde 3 kutumuz olsun.Bu kutular <p> ,<h1>,<h2>… gibi elemanlar olabilir.Bildiğiniz gibi html elemanları aksi belirtilmedikçe bir kutu üretirler.
Burdaki örneğimizde 3 kutu normal akışta devam ediyorlar. Peki 3. kutu , 2. kutunun genişlemesiyle beraber genel genişliğin dışına çıkarsa ne olur?

İşte bu olur 3. kutu aşağıya kayar.Aynı sidebar’ımızın aşağı kayması gibi. Peki ne yapacaz?

Yapacağımız işlem şu;
style.css dosyamızı açacaz. Orda #sidebar yazan tanımlamayı bulacaz. Bu tanımlamada width, background, float gibi nitelikler vardır. Bunlara dokunmadan yeni bir niteklik tanımlıcaz. Niteliğimiz position niteliği. Position ile 3. kutuyu normal akıştan çıkaracaz ve 2. kutunun sağına atabilecez.
Örnek kodumuz şöyle;

#sidebar
{ position:absolute;
left:500px;
}
Bu 500px i sizin temaya göre düzenlemeniz gerekiyor.Fazla  yada eksik verebilirsiniz.Dediğim gibi sidebar içindeki diğer kodları ellemeden sadece yukarıdaki kodu ekliyoruz.Bu kod ile artık sitemizdeki sidebar şu şekilde görülecektir.

Son bir işlemimiz daha var. Bu verdiğim kodlarla sidebar sorunu çözülecektir ama farklı çözünürlükteki ekranlarda ne yazıkkki farkı görünecektir. Yani geniş ekranlı bir monitörde baktığınızda sidebar anasayfaya binmiş olarak görünebilir.
Bununda çözümü var. Sidebar ı çevreleyen elemana position:relative; kodunu eklemek. O zaman hangi çözünürlükte bakarsanız bakın aynı görünecektir.
Peki sidebar ı çevreleyen elemanı nasıl bulacaz?

Bu kod genellikle #content ile tanımlanır, bazı temalardayda #container temadan temaya fark gösterir. Eğer bulamazsanız style.css i yollayın bakıp yanıt veririm.

Örneğin sidebar’ı çevreleyen eleman #content diye tanımlanmış olsun. O zaman #content tanımının içine şu  kodu yerleştirecez;
position:relative;
Hepsi bu kadar.
umarım anlatabilmişimdir. Yararlı olması dileğiyle, kolay gelsin