缩小视口时将第二列放在顶部

时间:2018-08-17 13:18:05

标签: css flexbox bootstrap-4

我想拥有3列-左列(1)可以增长或收缩的文本,第二列是固定宽度的图像(2),第三列可以增长或收缩的文本(3),但是应该与(1)相同。

那很容易。但是对于狭窄的视口,它们应该与(2)图像堆叠在顶部,然后在左列(1)之下,在右列(3)之下

我正在使用bootstrap 4.1,但也可以使用常规的flexbox-如果我知道如何...

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

您需要使用“ https://getbootstrap.com/docs/4.1/utilities/flex/#order”。 首先将元素设置为可移动(窄视口),然后在Tablet和桌面视图中更改元素的顺序。