flex布局,容器的宽和高分别设置100%,子元素image 宽和高设置200rpx;父元素的宽高跟随子元素,并没有出现100%的效果

Question

wxml:

<view class='tz'>

 <image class='tz-image' src='../../image/tz.png'></image>

 <text class='tz-text'>欢迎来到***平台</text>

wxss:

.tz{

 width: 100%;

 height: 100%;

 display: flex;

 background: rebeccapurple;

 margin: 5rpx;

}

.tz-image{

 width: 200rpx;

 height: 200rpx;

}

.tz-text{

 background: red;

 }

</view>