Wordpress'te Custom CSS @media only screen editleme...

arkadşlar wordpress'te @media only screen css kodları için editleme yapıyorum, tema ayarlarından custom css kısmına aynen mesela@media only screen and (max-width: 1169px)
@media (max-width: 1024px)
.nav-footer ul.nav li.dropdown > a > button { top: 9px;}

ekliyorum fakat hiçbir değişiklik olmuyor, ardından, responsive css içinde bu kod mesela ordan da değiştiriyorum yine değişiklik olmuyor @media only screen kodlarını başka şekilde mi editlemek gerekiyor?

Merhaba, aşağıdaki gibi yapmanız gerek, acaa atladığınız bir nokta olabilir mi?

/*   Phone  : 320px -----------------------------   */
@media only screen and (max-width: 479px){
kodlar bu alana şeklinde
}

css'de @media kullanımında en sık yapılan hata rastgele kullanılmasıdır. @media min-max çözünürlükleri girerek tasarımı responsive yapabilirsiniz ama css dosyanızda sıralamanızda yüksek çözünürlükten düşük çözünürlüğe doğru olmalı. aksi durumda çoğu tarayıcı css kodlarını yorumlarken karıştıyor. bu sıralamaya uyduğunuz halde istediğiniz sonucu alamıyorsanız değişkeni tetikleyen başka bir css dosyasındaki kod bloğu olabilir. bu durumda @media içerisindeki değerlerde !important kullanabilirsiniz.

aynen doğru, zaten mevcut dosyadan editliyorum sıfıradan eklemiyorum ona rağmen etki olmuyor...

@media screen and (min-width:768px){}
"and" kullanmanız gerekiyor ve değişiklikleri görebilmeniz için tarayıcıda ctrl + r ile yenileyin.

wordpress'in tema ayarlarından custom css ile eklediğim zaman kırmızı gösteriyor... bu dediğiniz şekilde de



@gecoist; arkadaşım pm ile yolladığı yeni css koduyla çözüldü yanlış yazmışım bazı yerleri teşekkür ediyorum başta ona ve yardım etmeye çalışan diğer arkadaşlara.