问答详情
源自：3-3 Flex弹性盒模型

请问flex布局高度自适应问题

请问当flex-direction: column;   父容器的高度只能用px单位  貌似不能用100%；  这个怎么办

提问者：李姓青年_ 2016-03-28 18:46

个回答

  • StayRealDream
    2016-05-01 12:29:01

    <style>

    html,body{height: 100%;margin: 0;padding: 0;}

    #outer{height: 100%;background-color: #ffc;display: flex;flex-direction: column;}

    或者height:400px;

    .inner{height: 40%;flex: 1 1 auto;margin-bottom:20px;background-color: #ddf;}

    </style>


    <body>

    <div id="outer">

    <div class="inner"></div>

    <div class="inner"></div>

    </div>

    </body>

    能不能用百分比要看父元素高度是否存在

    0
  • 学习者1514
    2016-03-29 16:17:46

    因为是按照父容器的高度来设置百分比的  你说的父容器 是因为它的父容器没有设置高度 所以不能设置%  如果父容器的父容器 设置了高度  则父容器就能设置%

    0