是否可以进行相对显示：内联块

Question

我之前不知道如何解决这个问题，经过this post之类的讨论和问题之后，我清楚地知道了什么是想要的功能（我不想重复使用旧问题）因为它被我的坏问题的答案污染了：）

所以这就是问题：

display:inline-block

允许我们在右边有空格将元素newt附加到它上面，如果没有空格，则返回到新行。

我的问题是：它能回到相对较新的路线吗？这意味着

• 如果它所在的线下方留有空间，请使用该空格
• 如果没有更多空间，请转到新行
• 如果第二行已满，同样适用，如果有空格，则跳转到左边元素旁边的第三行
• 以级联模式进行此操作

这是一个解释问题的方法 http://jsfiddle.net/zhamdi/zu5sU/6/

Answer 1

是否有任何理由你不能将右侧包裹在一个额外的div中。

<强> HTML

<div class="container">
        <div id="1" class="left"> left one this is where it gets tricky, look there is plenty of space to the right, but instead of taking it, the div id=3 is coming below me. stupid one! :)
        </div>
        <div class="right">
            <div id="2" class="one"> right takes as much place as it wants lkjml mlkj mlk mlkj mlkj mlkjmkjm ilm lkjml jmijom llkj mkjmjmij lj
            </div>
            <div id="3" class="two"> this one also, if there is no more room, it jumps to the next line under left
            </div>
        </div>
</div>

<强> CSS

.container{

}

.left{
    display: inline-block;
    background: red;
    max-width: 100px;
}
.right{
    display: inline-block;
    vertical-align: top;
    border: solid 1px #000000;
}

.one{
    background:blue;
}
.two{
    background:green;
}

<强>结果