div块改变大小以后周边的div如何自适应？

Question

我的问题是这样的，我有一个汽车的模型对象，由一个汽车的图片和一个蓝色的矩形构成的，现在我的问题是我要改变底下矩形的长和高，但是需要旁边的另一个根据它的变化进行相应调整，例如矩形变宽了以后，右边的模型相应的自动靠右一点，保持挨着的关系

如下图这是原始的两个模型

我把左边第一个车道变长了，可以看到右边多出来一部分

现在两个交换位置就可以看出来了

我想要达到的效果是当左边增大时，右边可以自动靠右边保持和他挨着但是不互相覆盖的关系。

先谢过了在这边

Answer 1

display:inline-block;或者float:left
这两个都可以让你改变长度然后把后面的挤开。别用position:absolute；用这个的话，你就得js自己算了

Answer 2

谢谢这个方法我试过的但是不知道为什么不起作用

可以看到如果只是两个矩形的话没有问题，但是如果是我自定义的模块就不起作用了。

<div class="brick small" v-for="n in 2">

                <div id="component" class="ui-widget-content" style="float:left;display:inline">
                      <div style="float:left;marigin:0 auto"><img src="img/sports-car.png"></div>
                      <div class="rect" style="float:left;marigin:0;width:200px;height:30px;border:1px solid #000;background-color:#00FFFF"></div>
                </div>
            </div>
            这是汽车部分的