弹性布局,flex-direction: column;盒子宽度不随着上面盒子变化
需求大盒子里面的上面盒子药固定宽度下面的盒子要随着自己文字内容宽度,要把下面盒子变成行内块样式 这样就不随着上面盒子变化了
.nameInfo { //大盒子
margin-left: 28upx;
display: flex;
flex-direction: column;
justify-content: space-around;
.nameInfo-t {//盒子上面
width: 300upx;
font-size: 36upx;
font-weight: 500;
color: #333333;
}
.nameInfo-b {//盒子下面
width: auto;
display: inline-block !important;
height: 40upx;
background-color: rgba(255, 93, 111, 0.08);
padding: 2upx 20upx 2upx 12upx;
box-sizing: border-box;
border-radius: 10upx;
display: flex;
justify-content: flex-start;
align-items: center;
.imageStyle {
float: left;
image {
width: 28upx;
height: 30upx;
margin-right: 4upx;
margin-top: 4upx;
}
}
.nation {
float: left;
font-size: 24upx;
font-weight: 500;
color: #FF5D6F;
}
}
}
本文来自博客园,作者:prince11,转载请注明原文链接:https://www.cnblogs.com/prince11/p/18001058