Utilice justify-content: space-between; para mostrar en dos lados
<div class="content">
<div class="top">头像</div>
<div class="bottom">资料</div>
</div>
CSS
* {
margin: 0;
padding: 0;
}
.content {
width: auto;
height: 500px;
border: 5px solid #000;
/* position: relative; */
display: flex;
justify-content: space-between;
}
.top{
width: 150px;
height: 150px;
background: forestgreen;
margin-left: 5%;
margin-top: 150px;
}
.bottom{
width: 150px;
height: 100px;
background: darkcyan;
margin-right:5%;
margin-top: 150px;
}