CSS: Listeyi yan yana yazmak,

          Merhaba arkadaşlar , normalde listelemek istediğimiz şeyleri en basit haliyle "ul" ve "li" tagları arasına yazarak listeleriz. Ancak burada bazı sıkıntılar çıkmakta. Yaptığımız liste hep üst üste çıkmakta ve istediğimiz şekle bürünemiyor. örnek vermek gerekirse.

şöyle bir yapı oluştursak

<ul>
    <li>Ana Sayfa</li>
    <li>Hakkımda</li>
    <li>Sayfalarım</li>
    <li>Resimlerim</li>
    <li>Videolarım</li>
    <li>İletişim</li>
</ul>

bu yapının görüntüsü şu şekilde karşımıza gelir.

Ana Sayfa
Hakkımda
Sayfalarım
Resimlerim
Videolarım
İletişim

Gördüğünüz gibi burada yalnızca yukarıdan aşağıya listeleme yapmaktayız. özellikle yatay menü yapmak isteyenler bu durumu çözmelidir. Bunun için aşağıdaki gibi bir html - css yapısı oluşturmanız yeterli olacaktır.

html yapısı

    <li>Ana Sayfa</li>
    <li>Hakkımda</li>
    <li>Sayfalarım</li>
    <li>Resimlerim</li>
    <li>Videolarım</li>
    <li>İletişim</li>

css yapısı

.menu{

    list-style: none

    display: block;

}

.menu li{

    display: inline;

    margin: 10px;

    position: relative;

}

son hali

• Ana Sayfa
• Hakkımda
• Sayfalarım
• Resimlerim
• Videolarım
• İletişim

Gördüğünüz gibi artık dikey değil yatay bir listemiz var.