移动式柔性箱柱的倒塌
移动式柔性箱柱的倒塌
提问于 2018-05-25 09:18:51
我有两列(使用flexbox)和一个媒体查询断点。然而，我尝试了下面的css属性，以获得100%的列，并在移动时相互叠加。
目前仍然是一个列，并排在任何时候。
宽度: 100%；
挠曲生长: 1；
容器的代码
.flexbox-container {
display: -ms-flex;
display: -webkit-flex;
display: flex;
}列的代码
.flexbox-column {
display: flex;
width: 100%;
padding: 50px;
background-color: yellow;
}
@media (min-width: 768px) {
.flexbox-column {
width: 50%;
background-color: #444;
}
}我的代码(我不知道如何让“运行代码”特性在这里工作) https://codepen.io/jordanc26/pen/yjWZQJ
Stack Overflow用户
回答已采纳
发布于 2018-05-25 09:28:10
移动这个规则
.flexbox-container {
display: flex;
}进入媒体查询范围就足够了：
实际上，对于窄视图，您的两个列元素不再位于flexbox容器中，因此它们将相互叠加，并扩展到整个可用宽度。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50525702
复制相关文章
相似问题
腾讯云开发者
