CSS selecters gibi kardeşlerin özelliklerini nasıl değiştirebilirim: focus?

Question

Sitemde bazı kodlarla ilgili sorun yaşıyorum, http://ethoma.com/wp/. Arama çubuğunda, sol tarafta, arama alanı (kardeşi): açıkken tetiklendiğinde açık griyi açmak için genellikle koyu gri "vurmak için enter tuşuna" basın istiyorum. , Arama alanı

#s 
{ 
    min-width:98%; 
    background-color:#2a2a2a; 
    color:#d3d3d3; 
    border:2px solid #000000; 
    font-size:.85 em; 
    height:1.9em; 
    display:inline !important; 
    border-radius:5px 5px 5px 5px; 
} 

#s:focus 
{ 
    border:2px solid #2a2a2a; 
} 

#searchsub 
{ 
    color:#2a2a2a; 
    text-align:right; 
    font-size:.65em; 
    font-weight:lighter; 
} 

#s:focus #searchsub 
{ 
    color:#cccccc; 
} 

Okay edilir #S ve #searchsub I (açık gri) #cccccc açmak istiyorum div geçerli: İşte şu anda sahip koddur. Son küme küme parantezleri, problemi yaşadığım yer gibi görünüyor (parantezlerin kendileri değil, üstündeki seçici). #s dediğim gibi #searchsub bir kardeşi ve tersi. Herhangi bir cevap için teşekkürler!

Answer 1

Stefmikhail, selektörünüzdeki alanın#s içinde anlamına geldiğini söyledi. HTML ile ilgili olarak, bu açık bir şekilde yanlıştır, çünkü input alanları boş öğelerdir ve bunların içinde başka öğeler olamaz.

#s:focus + #searchsub 
{ 
    color:#cccccc; 
} 

Answer 2

sizin koduyla sorun #s:focus #searchsub yılında #s:focus sonra #searchsub yerleştirerek, sen id #s içindeki id #searchsubüzerine hareket CSS söylüyorsun olmasıdır.

JamWaffles ile bunu javascript ile yapabileceğinizi kabul ediyorum. Bunu jQuery ile yapardım ve eğer istersen nasıl gönderebilirim.