Javascript 仅使用css自动将中心div左右两侧的div移动到中心div下方

我知道，如果div不适合查看窗口，样式化div inline将自动将div包装到下一行，并且在某些情况下，这会用于快速而肮脏的移动版站点

我想这样做，但双方同时进行。当您查看jsfiddle时，它将更有意义。这在css中是可能的，还是功能不够强大

.a{
显示：内联块；
宽度：100px；
高度：100px；
填充物：5px；
浮动：无；
边框：1px纯蓝色；
背景颜色：黄色；
}
.b{
显示：内联块；
宽度：200px；
高度：100px；
填充物：5px；
浮动：无；
边框：1px纯蓝色；
背景颜色：黄色；
}
c{
显示：内联块；
宽度：100px；
高度：100px；
浮动：对；
填充物：5px；
边框：1px纯蓝色；
背景颜色：黄色；
}
应该在左下角结束中间div应该在顶部结束应该在右下角结束

您可以使用flex和order属性。这是一个例子。您只需要根据需要对其进行配置

html，正文{
身高：100%；
}
身体{
保证金：0；
}
.包装纸{
显示器：flex；
宽度：100%；
高度：100px；
}
.盒子{
宽度：20%；
高度：100px；
填充物：5px；
边框：1px纯蓝色；
背景颜色：黄色；
}
.盒子{
顺序：1；
}
.方框b{
宽度：30%；
顺序：2；
}
.方框c{
左边距：自动；
顺序：3；
}
@全部和全部介质（最大宽度：600px）{
.包装纸{
柔性包装：包装；
}
.盒子{
宽度：47%；
保证金：0；
顺序：2；
}
.方框b{
宽度：100%；
顺序：1；
}
.方框c{
宽度：47%；
保证金：0；
}
}

应该在左下方结束
中间的div应该在顶部结束
应该在右下方结束

也许您正在寻找过渡？也许这也有帮助？