如果左右div太靠近，如何移动中间div？

Question

我有3个div元素。 [左] [中] [右]

如果[left]和[right]保持接近，因为它们即将触摸中心div，中心div应向下移动，如下图所示。

[左] _______ [右]

   [center]

我已经尝试了这个，但却无法达到这个位置。我相信这不是一个新概念。我尝试过flex-box但无法实现所需的行为。我会感激任何帮助。谢谢。

Answer 1

为了说明我在问题中缺乏信息的观点，这里有一个解决方案可以完全满足您的要求，但不会帮助您解决问题。请提供更多背景信息。

＆＃13;

＆＃13;

div {line-height:3em; text-align:center}
.left, .right {width:200px; max-width:calc(50% - 2px); float:left; border:1px solid; overflow:hidden}
.right {float:right}

＆＃13;

<div class="left">This is the left div</div>
<div class="right">This is the right div</div>
<div class="middle">This is the center div</div>

＆＃13;

＆＃13;

＆＃13;