使用Safari问题显示flex

时间:2017-09-13 13:19:22

标签: html css css3 safari flexbox

这里的问题很少。

Safari和flex存在问题。

这是我想用chrome实现的,以及Safari的结果 Result with chrome, firefox, ...with Safari

代码:

<style>
  #div1{background:black;width:250px;height:600px;display:flex;flex-direction:column;padding-bottom:5px}
  #div2{background:pink;color:#FFF;width:240px;height:200px}
  #div3{background:blue;color:#FFF;width:240px;height:100%;position:relative}
</style>

<div id="div1">
  <div id="div2">test</div>
  <div id="div3">test2</div>
</div>

你有什么想法吗?

1 个答案:

答案 0 :(得分:1)

我找到了解决方案。这是我做的:

#div3{
  background:blue;
  color:#FFF;
  width:240px;
  height:100%;
  flex:1 1 100%;
  height:auto;
}