浮动div左侧和div居中而不重叠调整大小

Question

我希望左边有一个div（Div 1）和div对齐的中心（Div 2）。

当用户调整窗口大小时，居中的div（Div 2）应保持居中，直至碰到Div 1的边缘。
Div 2（居中div）不应始终向左停靠，除非Div 1（左div）的宽度加上Div 2宽度的一半大于浏览器宽度的一半。

关于在没有javascript的情况下实现这一点的任何想法？

Example as image http://i42.tinypic.com/iqv5tu.jpg

以下是一个工作示例：http://jsfiddle.net/pjg8D/9/

Answer 1

问题的解决方案是在容器div上使用min-width。此宽度的比率计算如下：（Div1宽度+ Div2宽度的一半）x 2。

解决方案在这里：http://jsfiddle.net/pjg8D/16/

Answer 2

你需要给左手div %宽度，然后给右手div left-margin相同的%。试试这个：

#div1 {
    width: 25%;
    height: 50px;
    background: green;
    float: left;
}

#div2 {
    width: 250px;
    height: 50px;
    margin: 0 0 0 25%;
    background: blue;
}

Updated fiddle