margin üstü başka bir div içinde div için

Question

Arka plan görüntüsüne sahip iki divum var ve 2. div'a marj eklemek istiyorum ama beyaz boşluk yaratıyor.

Divanı diğer divun içinde tutarken üst kenar boşluğunu nasıl ekleyebilirim?

<div class="background"> 
    <div class="logo"> 
    </div> 
</div> 

.logo { 
    background-image: url(image/logo2.png); 
    height:40px; 
    width:400px; 
    margin-left:100px; 
    display:block; 
    margin-top:20px; 
} 

.background { 
    background-image: url(image/empback.png); 
    width:100%; 
    height:94px; 
    min-width:1345px; 
} 

Answer 1

Burada cssposition mülkiyet yararlanabilir.

Örnek Kod

<div class="background"> 
    <div class="logo"> 
    </div> 
</div> 

.logo 
{ 
    background-image: url(image/logo2.png); 
    height:40px; 
    width:400px; 
    margin-left:100px; 
    display:block; 
    position:absolute; 
    top:20px; 
} 

.background 
{ 
    background-image: url(image/empback.png); 
    width:100%; 
    height:94px; 
    min-width:1345px; 
    position:relative; 
} 

margin-top:20px; kaldırıp .logo için position ve top özelliğini ekleyin.

Answer 2

Bu konuyla ilgilidir

Demo

.background{ 
    background: #f00; 
    width:100%; 
    height:94px; 
    min-width:1345px; 
    overflow: auto; 
} 

Sadece share bir bağlantı var ebeveyn elemana overflow: auto kullanabilirsiniz.

---

Ayrıca, bu doğru daha iyi bir yaklaşım yerine sadece flottede elemanı tutmayacaktır top ile position: relative;, left, right ve bottom özelliklerini kullanmalıdır position: absolute; kullanmanın, aynı zamanda konumlandırma kurtaracak Aynı bloktaki diğer öğeler.

Demo 2

Answer 3

Sadece kod üzerinden gidin.

Sadece konumu ve üst değeri değiştirerek sonucu alabiliriz.

.logo{ 
position:relative; 
top:10px; 
background-color:black; 
height:40px; 
width:400px; 
margin-left:100px; 
display:block; 
margin-top:20px; 
} 

.background{ 
    position:absolute; 
    background-color:green; 
width:100%; 
    top:50px; 
height:94px; 
    min-width:1345px; 
}