在IE11中将多列flexbox布局渲染为单行
在IE11中，将多列flexbox布局渲染为单行是由于IE11不支持flexbox的多列布局。在IE11中，flexbox布局只支持单行布局，即所有的flex子项会在一行中排列，如果空间不足，则会压缩子项的大小。
为了在IE11中实现多列flexbox布局的效果，可以考虑使用其他布局方式，如使用float属性或者CSS Grid布局来实现多列布局。以下是一种可能的解决方案：
- 使用float属性：可以将每个flex子项设置为float:left，使它们在一行中排列。但是需要注意的是，这种方法需要手动计算每个子项的宽度，以确保它们能够适应容器的宽度。
- 使用CSS Grid布局：CSS Grid布局是一种强大的网格布局系统，可以轻松实现多列布局。可以将容器设置为display:grid，并使用grid-template-columns属性指定每列的宽度。然后，将每个flex子项放置在网格中的相应位置。
需要注意的是，以上解决方案都是针对IE11中不支持多列flexbox布局的情况而提出的替代方案。在现代浏览器中，多列flexbox布局是被广泛支持的，可以直接使用flexbox布局来实现多列布局。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎 TKE：https://cloud.tencent.com/product/tke
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ai
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iotexplorer
- 移动应用开发平台（MPS）：https://cloud.tencent.com/product/mps
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙：https://cloud.tencent.com/solution/virtual-universe
相关·内容
1回答
在Chrome/Firefox/Safari中，我得到了一个很好的三列布局。.row的高度等于文本的line-height。: 0 auto; padding: 0 7px 7px 7px;.row { display: -ms-flexbox;} positi
浏览 9提问于2016-07-26得票数 3
回答已采纳
1回答
我有两列的布局。当并排渲染时，它们必须具有相等的高度(大屏幕)。在移动上，他们应该聚集起来。我用旧的BS网格来做这个。
这里有一个代码库：
浏览 1提问于2018-01-28得票数 1
回答已采纳
我正在尝试让page-break-inside: avoid在一个使用多行flexbox布局(使用flex-wrap: wrap)的表单中工作。这样做的目的很简单，就是避免在打印时中断表单问题。这对于单行的flexbox或者没有flexbox都能很好地工作。Chrome和IE11上都试过了，两者都表现出相同的行为，这让我认为这不是浏览器的bug。(FF目前还不支持多线路flexboxes，所以要到明年年初才能在那里工作)
有没有人知道如何让flex-w
浏览 3提问于2013-12-06得票数 20
2回答
通过引入flex，有两种方法对内容进行垂直中心化。.is-vertical-center { align-items: center;另一个是： display: grid;}
浏览 2提问于2019-04-14得票数 0
回答已采纳
但在IE11中，导航条出现在图像的顶部。我知道IE 11有问题的引导带对齐，这可能是其中之一，但不知道是否有任何解决办法，以使肚脐保持在IE的底部图像？
浏览 4提问于2021-07-17得票数 0
回答已采纳
该设计对所有布局都使用了flexbox。在Ember中，我为每个250px列生成了
浏览 0提问于2016-06-08得票数 0
每个<li>包含一个锚点，即display: flex列，用于正确对齐其中的元素，包括主图像容器和图像。在每个浏览器中，包括IE10，这是绝对好的，没有问题。然而，在IE11中，这是问题开始的地方。IE11将图像容器高度计算为源图像的实际高度，而不是渲染时图像的高度。这最终会使<li>比它应有的高度要高得多。布局在每个有自尊的浏览器中的样子：布局在IE11
浏览 13提问于2016-07-18得票数 6
回答已采纳
1回答
我想知道我是否应该开始使用flexbox进行网站/webapp的布局设计，而不是浮动div，等等。然而，创建了css3 flex规范的Tab Atkins有一个名为“为什么flexboxes不适合页面布局”的页面所以我的结论是，他的意思是它不应该用于复杂的页面布局。所以我的问题是，到目前为止，在创建页面布局方面
浏览 1提问于2014-12-04得票数 5
2回答
引导卡不下移
、、、、
我想找人帮忙处理我的自助卡。我有4张卡片，横贯整个页面的宽度。当在移动设备上访问网站时，它们仍然保持水平延伸，然后垂直延伸。我希望他们能站在另一个上面。我会感谢你的帮助。谢谢。
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZ
浏览 0提问于2018-09-20得票数 1
回答已采纳
2回答
在下面的代码片段中，我有两个flexbox容器:一个主容器，包装行，第二个容器，嵌套在第一个容器中，它有一个列方向。.flexbox { flex-wrap: wrap; flex: 1 1 auto;
.flexbox-columnclass="flexbox flexbox-element flexbox-column" style=&q
浏览 1提问于2018-05-13得票数 3
回答已采纳
1回答
我试图使用flexbox创建一个三行布局，这是响应性的(可以有三行的多列)。第二行(深蓝色框)应该自动增长，以便容纳内部的li数量。底部行应该始终与页面底部对齐，以便在两列之间对齐未使用的惩罚(可能有更多的列，但两列似乎是一个很好的示例)。我尝试过各种各样的东西，
将底部div设置为absolute和bottom: 0只会使其显示在第二行的顶部。任何帮助都将不胜感激--如果可能的话，我会尝试在不使用J
浏览 7提问于2015-01-18得票数 1
回答已采纳
大约一周前，我已经从设计网页的HTML表格布局跳转到CSS，此后我一直在阅读更多关于它的文章。昨天，我在这里读到了一篇关于堆栈溢出的长篇文章，用户在那里敲float，以及他们对布局的反对程度。在我看来，在这个设计中，我所做的任何事情在IE中都没有得到尊重。它就像包裹在左边的任何东西下面。
我想知道我是否可以使用浮点数，或者我是否应该使用inline-block。一个示例说明了如何在两个div相邻，其中一个在左边，另一个在右边，使用inline-block将是一个很好的例子。
浏览 1提问于2012-03-19得票数 41
回答已采纳
我在做两列的布局。这两列将显示一个iframe，两者的宽度将定义为内联样式/ be在CMS中设置。如果iframe小于列，则应垂直居中。如果它大于该列，则应收缩到该列的最大宽度，即近50%宽。在Firefox 33和IE 10中，这也是可行的。(我很懒，所以我没有在小提琴中添加IE10-flexbox语法。)在新的FF34中，它的行为与在IE11
浏览 1提问于2014-12-03得票数 7
回答已采纳
我需要报告"Employee Name“和"Age"，但我不需要将姓名继续到下一页；我需要继续到下一列。
浏览 2提问于2012-06-04得票数 14
回答已采纳
随着容器高度的变化，是否有可能将一个动态/未知数目的复选框水平地重新流到列中？Checkbox 3 [ ] Checkbox 8[ ] Checkbox 5
当容器元素的高度缩小时，复选框元素将水平溢出到一个新列中注意:我很清楚，我可以以编程的方式创建自己的列，我只是想看看是否可以使用纯/。
浏览 3提问于2013-10-21得票数 3
回答已采纳
2回答
我正在尝试找到一种在pandas中将JSON行数据拆分(扁平化)为多列的方法。我有一个数据帧，如下所示： Current Dataframe 以下是行的外观示例： Row example 我能够在单行上使用json_normalize函数来实现以下目标：(仅作为示例进行了简化)谢谢 我为使用图片道歉，但我一直收到一条消息，说代码格式不正确
浏览 161提问于2021-08-20得票数 2
在客户选择位置的部分，我想在行中放置6个按钮。我正在使用List来显示我所有的按钮。如图所示，前6个按钮具有正确的位置(红色按钮)。但是蓝色按钮应该在下一行(就像我在图片上显示的那样).How我能做到吗？
浏览 0提问于2019-01-13得票数 0
1回答
请检查这个，当你调整窗口的大小时，当卡片下降的时候，卡片的底部看起来很奇怪，它们之间有更多的空间。我希望这些卡片的底部部分与上面的卡片对齐。 display: flex; flex-wrap: wrap; min-width: 200px; height: 200px;
box-shadow: 0p
浏览 0提问于2017-04-21得票数 3
回答已采纳
1回答
因为桌子显然不会折断+换行，所以在移动设备上，桌子的右手边会消失在屏幕的右边。
这个是可能的吗？如果是这样，我将如何实现它？
浏览 3提问于2019-12-01得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
