flex布局问题

将flex-direction设置成column发现justify-content属性是无效的

 .son {
        width: 200px;
        height: 200px;
        border: 1px solid red;
    }
    
   .wrap {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        
    }
    


----------
 <div class="wrap">
        <div class="son">1</div>
        <div class="son">2</div>
    </div>

图片描述

如图所示,1和2紧贴在一起,没有上下分离


而在阮一峰的flex教程上,是可以这么写的
图片描述

请问是怎么回事

阅读 8.1k
2 个回答

你给外层设置个高度试试,要大于内层的总高度。你现在这样子,外层是被内层撑开的。当然实现不了那个效果啦。

.wrap定义一下宽高,再试一下

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题