Üye Girişi
Bağlan Google+ ile Bağlan Facebook ile Bağlan
Yeni Kayıt
Tüm Forumlar
  • Tüm Forumlar
  • Web Tasarım - Programlama
  • Tasarım ve grafik
  • Web Tasarım ve Hazır Kodlar
  • Bu Konuda
Şimdi Ara

Css Menü Yatay Ortalama

Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
Bu Konudaki Kullanıcılar:
2 Misafir - 2 Masaüstü
5 sn
6
Cevap
0
Favori
2.824
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
Konuya Özel
0 oy
Öne Çıkar
Cevapla
Sayfa: 1
Giriş
Mesaj
  • Css de yeniyim ve bi sorunum var menüyü ortalamak istiyorum ama yapamıyorum. arka fon %100 olacak sadece yazılar ortalanması gerekiyor Yardım edebilecek olan varmı


    (HTML KODU )

    <ul id="nav">

    <li class="current"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111841758&url=http://" data-href="http://">Eğlence</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111841758&url=http://" data-href="http://">İlginç</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111841758&url=http://" data-href="http://">Müzik</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111841758&url=http://" data-href="http://">Spor</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111841758&url=http://" data-href="http://">Vine</a></li>

    </ul>
    </div>



    (CSS KODU)

    #nav {
    display:inline-block;
    width:100%;
    margin:0px auto;
    padding:0;



    background:#335599 url(resimler/bg.png) repeat-x 0 -110px;


    -moz-border-radius:10px;
    -webkit-border-radius:10px;

    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);
    }
    #nav li {
    margin:10px;
    float:left;
    position:relative;
    list-style:none;




    }

    #nav a {
    font-weight:bold;
    color:#e7e5e5;
    text-decoration:none;
    display:block;
    padding:8px 20px;


    -moz-border-radius:10px;
    -webkit-border-radius:10px;

    }

    /* selected menu element */
    #nav .current a, #nav li:hover > a {
    background:#7788aa url(resimler/bg.png) repeat-x 0 -20px;
    color:#000;
    border-top:1px solid #f8f8f8;


    -moz-box-shadow:0 2px 2px rgba(0,0,0, .7);
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .7);

    }

    /* sublevels */
    #nav ul li:hover a, #nav li:hover li a {
    background:none;
    border:none;
    color:#000;
    }
    #nav ul li a:hover {
    background:#335599 url(resimler/bg.png) repeat-x 0 -100px;
    color:#fff;


    -moz-border-radius:10px;
    -webkit-border-radius:10px;

    }

    #nav ul li:first-child > a {
    -moz-border-radius-topleft:10px; /*some css3*/
    -moz-border-radius-topright:10px;
    -webkit-border-top-left-radius:10px;
    -webkit-border-top-right-radius:10px;
    }
    #nav ul li:last-child > a {
    -moz-border-radius-bottomleft:10px; /*some css3*/
    -moz-border-radius-bottomright:10px;
    -webkit-border-bottom-left-radius:10px;
    -webkit-border-bottom-right-radius:10px;
    }

    /* drop down */
    #nav li:hover > ul {

    visibility:visible;
    }
    #nav ul {

    visibility:hidden;
    padding:0;
    width:175px;
    position:absolute;
    background:#aabbcc url(resimler/bg.png) repeat-x 0 0;
    border:1px solid #7788aa;

    -moz-border-radius:10px;
    -webkit-border-radius:10px;

    -moz-box-shadow:0 2px 2px rgba(0,0,0, .5);
    -webkit-box-shadow:0 2px 2px rgba(0,0,0, .5);

    -moz-transition:opacity .25s linear, visibility .1s linear .1s;
    -webkit-transition:opacity .25s linear, visibility .1s linear .1s;
    -o-transition:opacity .25s linear, visibility .1s linear .1s;

    }
    #nav ul li {
    float:left;
    margin:0;
    }
    #nav ul a {
    font-weight:normal;

    }
    #nav ul ul {
    left:160px;
    top:0px;
    }



    < Bu mesaj bu kişi tarafından değiştirildi ketrapol -- 13 Kasım 2015; 11:32:55 >







  • Merak Eden Veya Kullanmak İsteyen Olursa Sorunu Bu Yöntemle Çözdüm

    Sorunu Bu Yöntemler Çözdüm Arkadaşlar Teşekkürler


    (HTML KODU)

    <ul id="nav">
    <div id="sad">
    <li class="current"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111849518&url=http://www.script-tutorials.com/" data-href="http://www.script-tutorials.com/">Eğlence</a></li></div>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111849518&url=http://www.script-tutorials.com/" data-href="http://www.script-tutorials.com/">İlginç</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111849518&url=http://www.script-tutorials.com/category/resources/" data-href="http://www.script-tutorials.com/category/resources/">Müzik</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111849518&url=http://www.script-tutorials.com/about/" data-href="http://www.script-tutorials.com/about/">Spor</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111849518&url=http://www.script-tutorials.com/creating-css3-dropdown-menu/" data-href="http://www.script-tutorials.com/creating-css3-dropdown-menu/">Vine</a></li>
    </ul>



    (Css Ek Kod )

    #sad
    {
    margin-left: 30%;
    }




  • ketrapol K kullanıcısına yanıt
    Bulmuş olduğunuz çözüm geçici bir çözümdür ve hiçte kullanışlı değildir.Bunun yerine altta yazdığım örnek kodları kullanınız.

    Öncelikle bir menü oluşturalım; 
     
      <ul> 
      <li>Deneme 1</li> 
      <li>Deneme 2</li> 
      <li>Deneme 3</li> 
      </ul>


    Daha sonra menünün her çözünürlükte doğru ortalaması için css kodlarımızı yazalım; 
     
      ul { 
      text-align:center; 
      width : 100%; 
      list-style: none; 
      padding:0; 
      } 
       
      li { 
      padding:0 10px 0 0; 
      float:none; 
      display:inline-block; 
      }


    Bu işlemlerden sonra menümüz sayfamızın çözünürlüğüne göre tam olarak ortalanmış gözükecektir.
  • MOLİVER kullanıcısına yanıt
    Hocam Teşekkür Ederim Yardımın İçin. Dediğiniz Gibi Düzelttim Oldu :))

    #nav {

    padding:0;
    width:100%;
    text-align:center;
    list-style: none;
    }

    #nav li {
    padding:0 10px 0 0;
    float:none;
    display:inline-block;
    }

    HTML

    <ul id="nav">

    <li class="current"><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111856951&url=http://www.script-tutorials.com/" data-href="http://www.script-tutorials.com/">Eğlence</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111856951&url=http://www.script-tutorials.com/" data-href="http://www.script-tutorials.com/">İlginç</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111856951&url=http://www.script-tutorials.com/category/resources/" data-href="http://www.script-tutorials.com/category/resources/">Müzik</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111856951&url=http://www.script-tutorials.com/about/" data-href="http://www.script-tutorials.com/about/">Spor</a></li>
    <li><a data-test="test" rel="nofollow" style="word-wrap: break-word; text-decoration: underline;" target="_blank" onclick="return dhExternalLinkRedirect(this)" href="/ExternalLinkRedirect?module=pgdcode&messageId=111856951&url=http://www.script-tutorials.com/creating-css3-dropdown-menu/" data-href="http://www.script-tutorials.com/creating-css3-dropdown-menu/">Vine</a></li>

    </ul>




  • ketrapol K kullanıcısına yanıt
    Rica ederim, kolay gelsin.
  • hocam her yerde margin-... kullanma geçici çözümdür bazı tarayıcılarda olumsuz gözükür kullanışlı değildir.
    • Yapay Zeka’dan İlgili Konular
    office 2007 word yatay-dikey sayfa dönüşümü
    15 yıl önce açıldı
    PASİF ÖĞRENCİ ORTALAMA İLE YATAY GEÇİŞ
    4 yıl önce açıldı
    2.50 İLE YATAY GEÇİŞ
    7 yıl önce açıldı
    Daha Fazla Göster
    
Sayfa: 1

Benzer içerikler

- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.
Hizmet kalitesi için çerezleri kullanabiliriz, DH'yi kullanırken depoladığımız çerezlerle ilgili veri politikamıza gözatın.
Kabul Ediyorum