Soldaki sabit genişlik div, kalan genişlik div'u sağda boşlukla doldurun

Question

Solda sabit genişlikte bir görüntüye sahip bir div ve arka plan rengine sahip bir değişken genişlik div, aygıtımın genişliğini% 100 uzatmalı. İkinci div'u sabit div'ım taşmasını durduramıyorum.

Taşma eklediğimde: Değişken genişlikteki boşlukta gizlenirse, sonraki satırda fotoğrafın altına atlar.

Bunu doğru şekilde nasıl düzeltebilirim (ör. Medya sorguları ile siteyi daha sonra yanıt vermem gerektiğinden ve görüntüyü her aygıt için diğer görüntülerle değiştirmem gerektiğinden) (hack veya kenar boşluğu olmadan)? Duyarlı web sitelerinin korku mücadele için çalışıyor

• acemi web tasarımcısı -

HTML:

<div class="header"></div> 
<div class="header-right"></div> 

CSS:

.header{ 
    float:left; 
    background-image: url('img/header.png'); 
    background-repeat: no-repeat; 
    width: 240px; 
    height: 100px; 
    } 

.header-right{ 
    float:left; 
    overflow:hidden; 
    background-color:#000; 
    width: 100%; 
    height: 100px; 
    } 

Answer 1

.header-right den float:left ve width:100% kaldırmayı deneyin - doğru div sonra istendiği gibi davranır.

Bkz. this jsfiddle. Iyi bir başlık için