2010-11-16 13 views
5

Firefox'ta CSS ile ilgili bir sorum var.Firefox, ek genişlik ekler.

Yüzen bir div genişliğini ayarlarsanız - 200px diyelim - Firefox'ta 10px'e kadar bir dolgu-solu ayarlamak, bu ekstra 10px'i genişliğe ekler. IE'de durum böyle değil.

Firefox'un ekstra genişliğin div'e eklenmesini önlemek için neler yapabilirsiniz?

+4

Daima fakat her zaman FF ve Chrome gibi bir standartları ile uyumlu tarayıcıda düzenleri tasarım. Sonra geri dön ve IE'nin işleri karıştırdığı yerleri bul. – Stephen

+1

Orada neler var quirks modunda IE var. FF, "kutu modeli" ni kullanarak CSS'yi doğru şekilde sunuyor. Buradaki kutu modeliyle ilgili bilgi edinin: http://www.w3schools.com/css/css_boxmodel.asp İçinde kodunuzla başka bir soru sormak isteyebilirsiniz, bunu size yardımcı olabiliriz. –

cevap

8

Bu, bu yüzden firefox değil problem, IE.

IE standartlarına gerçekleştirmez, orada bu bir kaç ipucu ama kıçından tüm bir ağrı vardır:

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

kolay yolu geçerli bir katı Doctype etiketi eklemektir

Sonra sadece standartlara uyumlu kutu modeli varsayılan olarak

More doctypes here

+0

Doğru ama yeni web sayfaları her zaman katı doktrinlerini kullanmalıdır. – Rob

+0

Ben de öyle dedim! : D –

+0

Geçişsel doctype'ı gösterirsiniz. – Rob

4

için, kutu boyutlandırma css yeniden IE'deki mozilla ve border-box'taki içerik kutusuna ayarlanır. kullanarak

:

-moz-box-sizing:border-box; 
-webkit-box-sizing:border-box; 
box-sizing:border-box; 

yılında stilin çok sen sınır kutusuna mozilla, safari ve opera kutu boyutlandırma çok ayarlayabilirsiniz.

fazla bilgi kontrolü için

: http://www.css3.info/preview/box-sizing/