左侧固定宽度div，在右侧填充剩余宽度div

我想要一个固定宽度的图像在左边的div和可变宽度的div与背景颜色，这应该扩大其宽度100％在我的设备上。 我无法阻止第二个div溢出我的固定div。

当我添加溢出：隐藏在可变宽度的div它只是在照片下跳转，在下一行。

我如何以正确的方式解决这个问题（即没有黑客或保证金，因为我需要使媒体查询后才能响应，而且我必须更改每个设备的其他分辨率图像）？

• 初学网页devise师试图解决响应网站的恐怖 –

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移除float:left和width:100% ，然后右边的div按照要求运行。

看到这个jsfiddle 。