2011-06-06 25 views
5

Gezinme çubuğunun içine bir Google Özel Arama Motoru formu ekledim ancak Opera'da orta hizalama yapamıyorum. Tüm tarayıcılar dikey hizalamaya tam olarak uyuyorlar (evet! Hatta IE .. vay!).Form öğesi, Opera'daki CSS dikey hizalamasına uymuyor

www.micod.cat adresinden kontrol edebilirsiniz (sitenin İngilizce değil ancak menü çubuğundaki Arama kutusunu kolayca görüntüleyebilirsiniz). Opera, form giriş alanını üst tarafa doğru akıtıyor ve bu yanlış.

#menu li.find form div { 
    padding: 0; 
    margin: 0; 
    height: 50px; 
    line-height: 50px; 
    vertical-align: middle; 
} 

Herhangi parlak zihinleri biraz fikir lütfen sunmak için:

İşte o öğenin CSS var? Çok teşekkürler!

cevap

1

Nedenini bilmiyorum, ya da ne olup bittiğini, ancak bir &nbsp;<input type="q" .. /> önce düzeltmeleri o yerleştirerek ediyor.

Daha iyi bir cevap için beklemelisiniz, ancak eğer ulaşmazsa, en azından bu işe yarar.

+0

Strict doctype bunu yapıyor, ama aynı zamanda küçük bir küçük '& nbsp' ... Ve DOCTYPE'in değiştirilmesi, sitenin diğer alanlarıyla bir sürü başka yan etki ortaya çıkardı, sanırım küçük, ama önemsiz olmayan küçük beyaz alan bir mil kazanıyor! Başka bir Davut (beyaz alan) Goliath (doctype) dayak !! Yeterince minnettar olamam. Çok teşekkürler beyler. ** Sen rock! ** – user706600

0

Bu, hizalamak istediğiniz içerik değil, içeriğin içindeki görüntüdür.

#menu li.find form div img{ vertical-align: middle; } 

ve sitenize bakarak ihtiyacınız

:

#menu ul.nav li.find { padding-top: 10px; } 
+0

içindeki herhangi 'img' unsurlar bulunmamaktadır' li.find', bu hiçbir şey yapmayacak. 'Padding-top 'eklentisi Opera'yı düzeltecek, ancak diğer tüm tarayıcıları kıracak. Fikirleri önceden denemek için Dragonfly kullanmalısınız ('CTRL + SHIFT + I'). – thirtydot

+0

Gönderdiğim düzeltmeler için Dragonfly'i kullandım, ancak diğer tarayıcıları bozacağını görüyorum, @Clairesuzy tarafından DOCTYPE mesajına bir göz atın –

3

Sorun, Doctype'tır, bunu sıkı bir veya HTML olarak değiştirir, örn.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 

XHTML geçiş Doctype, bu etkileyecek oldukça neden bilmiyorum ama Operası, "Neredeyse Standartları" modunda görüntüler demektir - Opera Doctype Switches

+0

Eğer haklıysan (Ben test etmedim; sanırım yaptığını): güzel yakalama! – thirtydot

+0

Doctype aslında işe yarıyor, fakat aynı zamanda şu anda çalışan web sitesinin diğer bölümlerini de yok ediyor. Yani, @thirtydot, harika ve güzel bir '& nbsp' ... taaadaaaa tarafından önerilen basit ve sihirli çözüm ile gitmeye karar verdim! Yine de teşekkürler. Doctype'un bir şekilde onunla bir ilgisi olduğunu asla düşünmezdim. – user706600

İlgili konular