2008-12-12 8 views
5

CSS ile tasarlanmış bir div etiketim var. Dolguyu 10px (dolgu: 10px) olarak ayarlıyorum, Firefox ve IE7'de istediğim gibi çalışır, ancak IE6'da altta ek dolgu ekler (yaklaşık 2-3px sanırım). Burada neler olduğu hakkında bir fikri olan var mı?IE6 altta ekstra dolgu var

Sadece bu fark

[güncelleme], bahsettiğim div etiketi arka plan-imajı vardır. Arka plan görüntüsünü kaldırdığımda, alttaki ekstra dolgu kaybolur. Herhangi bir fikir?

[başka güncelleme, kod örneği] İşte

benim div etiketine uygulanan CSS: Çok bir positioniseverything.net yerinde göz ve IE sorunları ve geçici çözümlerden onun kapsama alarak tavsiye ederim

.user-info{ 
    margin-top: 20px; 
    margin-right: 20px; 
    padding: 10px; 
    background-image: url("../img/user_panel_bg.png"); 
    float:right; 
    border: 1px #AAAAAA solid; 
    font-size:12px; 
} 
+0

bir kod numuneyi – bendewey

+0

Ditto dahil etmek için bu yayını düzenlemek Can:

<div class="box"> <h1>Heading</h1> <p>This is the main content.</p> <div class="bottom"></div> </div> 

... Bu CSS gerekecektir. Bunun bir çok nedeni olabilir (IE 6, muhtemelen buna neden olan oldukça ilginç bir kutu modeline sahiptir, ancak bazı kodlar olmadan söyleyemeyiz). –

+0

Aynı sorunu dolgu ve arka plan görüntüsü ile yaşadım. Onu asla çözemedim.Etrafımdaki işlerimi kaldırmak ve doldurmak ve bunun yerine bir kenarlık kullanmak (beyaz üzerine beyaz olduğu için işe yaradı) ... Bir gizem ... –

cevap

17

Senin divanda bir görüntü var mı? Bir görüntü varsa, alt

Ekstra dolgu üzerinde ekstra dolgu oluşturmak için div içinde boşluk neden olabilir IE 6'da bir hata olduğunda görünmüyor

<div> 
<img src="myimage.jpg"> 
</div> 

Ekstra dolgu ile gösterir orada Eğer Ayrıca tarayıcılar arasında makul tutarlı olmalıdır varsayılan kurmak sağlayacak bir CSS reset style sheet gibi bir şey bakabilirsiniz

<div><img src="myimage.jpg"></div> 
+0

Bir yıldan fazla ama +1 benden :-) Muhtemelen en tehlikeli IE6 hatası Şimdiye kadar yaşadım. Ta Kibbee! –

+1

3 yıl sonra ve +1 benden. IE8'de de aynı şey. – yosh

+2

try img {display: block; } – yoshyosh

4

. Holly hack bölümüne bir göz atın - orada cevabı bulacağınıza inanıyorum.

[değiştir - katma] sitepoints box model article yanı bazı iyi fikir veriyor, 3px sorunu, açıklama için bir göz here almak ve kutu ayarları ve tarayıcı farkı için

düzeltin.

2

DIV taşmağınızı gizlemeyi denediniz mi? overflow:hidden;

Düzenleme: Yatay itme hakkında konuşuyorsanız, display: inline;'u da deneyebilirsiniz.

0

potansiyel olarak 'kenar boşluğu' veya 'kenarlık' özellikleri?

1

Yazı tipi boyutunun sorun yaratmadığından emin olun. Bir kap elemanının içinde hiçbir metin olmasa bile (gerilebilir bir kapta alt kapak için söyleyin) IE6, yazı tipi boyutundan daha küçük olmayan bir kutunun yüksekliğini (açık bir yükseklik ayarıyla bile) bile boyutlandıracaktır.

örnek, HTML varsa:

<style type="text/css"> 
    .box { 
    background: url(bg-middle.jpg) repeat-y; 
    } 
    .box h1 { 
    background: url(bg-top.jpg) no-repeat; 
    } 
    .box .bottom { 
    background: url(bg-image.jpg) no-repeat; /* bottom cap image */ 
    height: 10px;        /* height of your bg image */ 
    font-size: 1px;       /* for IE6 */ 
    } 
</style>