Question

所以，我有一个

<div style="width:250px;border: 1px solid;overflow:auto" id="container">
    <div style="float:left;">Vasileostrovsky rayon</div>
    <div id="rightAlignedDiv"> Div which will be expanding </div>
</div>

如何让#rightAlignedDiv扩展到左侧。换句话说，当#rightAlignedDiv足够宽时，我希望它将左边的一个推得更小，只有左边的div可以移动到新的行:)。

这是展示困境http://jsfiddle.net/eC9ZX/1/

的小提琴

这必须以某种方式使用css解决。 JS解决方案会使逻辑过于复杂。它不会是一个优雅的。

Answer 1

window.alterWidth = function() {
    var testWidth=parseInt(document.getElementById("testId").style.width);
    var testWidth1=parseInt(document.getElementById("rightDiv").style.width);

     document.getElementById("testId").style.width = (testWidth-33)+'px';
    document.getElementById("rightDiv").style.width = (testWidth1+33)+'px';
    var newImg = $('#com_ibm_ioc_spb_kpi_StatusBox_412').clone();

    $('#rightDiv').append(newImg);


}

将id赋予div并为第一个div设置溢出自动。

另请尝试这个小提琴http://jsfiddle.net/L774V/

展开右浮动div以推左div

1 个答案: