小编Diz*_*izz的帖子

flex属性在IE中不起作用

我一直无法确定为什么flexbox在IE 11中不起作用.

为了测试,我从CodePen中获取了一个非常简单的flexbox布局,并粘贴了以下信息.

Chrome按预期工作; IE11失败了.

在Chrome上运行的布局成功图像:

在此输入图像描述

IE11上布局失败的图像

在此输入图像描述

body {
  background: #333;
  font-family: helvetica;
  font-weight: bold;
  font-size: 1.7rem;
}

ul {
  list-style: none;
}

li {
  background: hotpink;
  height: 200px;
  text-align: center;
  border: 2px solid seashell;
  color: seashell;
  margin: 10px;
  flex: auto;
  min-width: 120px;
  max-width: 180px;
}

.flex {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
Run Code Online (Sandbox Code Playgroud)
<ul class="flex">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
  <li>7</li>
  <li>8</li>
  <li>9</li>
  <li>10</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

http://codepen.io/hankthewhale/pen/IdKkB?editors=110

html css css3 flexbox internet-explorer-11

20
推荐指数
2
解决办法
2万
查看次数

标签 统计

css ×1

css3 ×1

flexbox ×1

html ×1

internet-explorer-11 ×1