the problem that multiple lines of text in a rectangle cannot be centered horizontally is as follows:
when there are multiple lines of text, there will be more white space in the red arrow on the right of the text box, so that it cannot be completely centered horizontally, as shown in figure
:
how to solve this problem if you want multiple lines of text to be completely horizontal and centered? Please take a look at it with your help. Thank you!
related codes
/ / Please paste the code text below (do not replace the code with pictures)
/ / .wxml
< view class= "action-deposit-container" >
< view class="deposit-lead" >
< view class="deposit-lead-border" >
< text class= "deposit-lead-text" > once you stop thinking, you can only follow the existing path, or stay where you are. < / text >
< / view >
< / view >
/ / .wxss
.action-deposit-container {
display: flex;
flex-direction: column;
overflow-x: hidden;
width: 100%;
}
.deposit-lead {
display: flex;
flex-direction: row;
box-sizing:border-box;
justify-content: center;
width: 100%;
height: 200rpx;
padding-top: 20rpx;
}
display: flex;
justify-content: center;
align-items:center;
box-sizing:border-box;
border-radius: 5px;
border: 1rpx solid-sharp8a8a8a;
width: 90%;
height: 160rpx;
margin-top: 20rpx;
padding: 20rpx 20rpx;
}
.notify-lead-text {
color:-sharp8a8a8a;
font-size: 34rpx;
}