css 文本两端对齐

<view class="t-body">
	<view class="c-line">
		<view class>客户单号：</view>
		<view class="c-content">YG20210012</view>
	</view>
	<view class="c-line">
		<view class="left">订单号：</view>
		<view class="c-content">SZYG210707002</view>
	</view>
</view>


<style>
	.t-body {
		padding: 30rpx;
		background: #fff;
		margin-bottom: 24rpx;
	}

	.cline {
		font-size: 28rpx;
		display: flex;
		margin-bottom: 20rpx;
	}

	.left {
		color: #666;
	}

	.content {
		color: #333;
		flex: 1
	}
</style>

效果图：

多列数据的情况下，我们为了美观，想让label两端对齐
想要的效果图

解决办法：
1.使用伪类解决

	.left {
		color: #666;
		text-align: justify;
		display: inline-block;
		width: 140rpx;
	}

	.left::after {
		content: '';
		display: inline-block;
		width: 100%;
		overflow: hidden;
	}

2.属性text-align-last: justify;

	.left {
		color: #666;
		text-align: justify;
		display: inline-block;
		width: 140rpx;
	}