左侧的DIV具有灵活的宽度，但在右侧靠近其他DIV

Question

我有一个固定宽度（960像素）的网站，我想添加一个总是在左边但总是在右边靠近另一个的行。如何用CSS做到这一点？问题是额外的行必须具有灵活的宽度，并且必须始终位于屏幕的左侧，但右端必须结束于另一个（内容）容器在右侧结束的位置。

Answer 1

使用js

• 1）等待窗口加载。
• 2）当用户调整窗口大小时启动脚本。
• My codepen

HTML

<div id="red">coucou</div>
<div id="green">coucou</div>

CSS

*{margin:0;padding:0;}
#red {width:1100px;margin:auto;background:red;height:100px;}

#green {background:green;height:100px;}

JS

window.onload=resize;


window.onresize= resize;

function resize(){

var larg =window.innerWidth ;
var largdiv= document.getElementById('red').offsetWidth  ;



var vava =  ( larg - largdiv ) / 2 + largdiv;
 //alert (vava);
document.getElementById('green').style.width = vava+"px";



}