两个黄色是红色的两个子view,上面的黄色又分为左右两个view，各有自己的text，但是右边的文字太多就会这样

WXML:

<view class=“view_foodgroups” id="{{foodgroups.id}}">

<view class=“view_name_slogan”>

<view class=“view_name”>

<text class=“text_name”>阿哲米线</text>

</view>

<view class=“view_slogan”>

<text class=“text_slogan”>这是宣传语啊啊啊啊啊啊啊啊啊啊啊啊啊啊</text>

</view>

</view>

<view class=“view_add_tags”>

<view class=“view_address”>

</view>

<view class=“view_tags”>

</view>

</view>

</view>

WXSS：

.view_foodgroups{

display: flex;

flex-direction:column;

justify-content: center;

height: 200rpx;

margin-left: 85rpx;

margin-right: 85rpx;

}

.view_name_slogan{

height: 50%;

width: 100%;

display: flex;

flex-direction: row;

position: relative;

}

.view_name{

}

.view_slogan{

margin-left: 20rpx

}

.text_name{

}

.text_slogan{

font-size: 30rpx;

overflow: hidden;

text-overflow: ellipsis;

white-space: nowrap;

}

.view_add_tags{

height: 50%;

width: 100%;

}

.view_address{

height: 50%;

width: 100%;

}

.view_tags{

height: 50%;

width: 100%;

}