让一个元素具有优先流，这样它就不会环绕其他元素？答案

【问题标题】：Make an element have priority flow so that it doesn't wrap around other elements?让一个元素具有优先流，这样它就不会环绕其他元素？
【发布时间】：2020-03-01 10:05:06
【问题描述】：

我在一个页面上有 3 个元素。 [1 2 3]。所有 3 个都有动态宽度，我希望中间元素保持在中间而不是被环绕。所以当左边或右边的元素开始溢出时，它们会被下推，而不是中间的元素。

我不确定如何实际执行此操作。我已经尝试过使用弹性排序，但这实际上改变了文档的流程。我也想过让元素 1 偏移到元素 2 的位置，将元素 2 偏移到元素的 1 位置，但是一旦元素 2 被推下，它就会看起来很奇怪。

如果有任何混淆，我基本上是尝试使用 [2 1 3] 的视觉效果来获得流 [1 2 3]，这样中心元素就不会被推出。

【问题讨论】：

标签： html css web

【解决方案1】：

我正在努力理解你的问题，所以我会根据我的理解来回答你！您可以将所有元素放在父 div 中并使用 position: relative; 在 CSS 中设置样式，然后将所有元素放在此父 div 中，然后这些所有“子”元素采用 CSS 样式 position: absolute，并通过 @987654323 控制它们@

您也可以使用引导程序或任何类似的框架，或者在纯 CSS 和 JS 中执行此操作。

我希望我能理解你到底想要什么，并且对你有所帮助。

【讨论】：

我不知道你是怎么理解的。就内容作为内联或内联块而言，DOM 的通常流程是从左到右（或者如果您使用 flex 功能，则从右到左）。如果您的页面变得大到只能容纳前两个元素，那么第三个元素将被包裹（意味着它将被下推到新的内容行）。我正在努力做到这一点，当这种情况发生时，它只会影响左右元素，但不会影响中心/中间元素。

【解决方案2】：

能够使用浮点数来做到这一点。将dom设置为正常的元素流，这样中间元素在流中排在第一位，左侧元素排在第二位，右侧元素排在第三位。向左浮动第二个元素。

【讨论】：