Flex layout problem

as shown in the figure, the words that want the name of the network do not wrap. The colorful town after
here breaks the line according to the number of words, but it is aligned on the left.
how to achieve it with flex?
structure is similar

              <div class="weui-cell__bd ">
                  <span class="t">
                    <i class="iconfont">
                      <svg class="icon" aria-hidden="true">
                          <use xlink:href="-sharpicon-gongsi"></use>
                      </svg>
                    </i>
                  
                  </span>
                  <span class="v">
                    TOWNTOWNTOWNTOWNTOWNTOWN
                  </span>
              </div>
Css
Mar.07,2021

the left setting keeps going, and the right setting flex:1


two columns, write a width normally on the left and

on the right
-webkit-flex: 1;
 flex: 1;
Menu