css文字两边加横线

1.解决方案 可以父 relative  子 绝对定位解决

2.我想出来的办法就是用flex布局解决

<div class="right-pay">
  <p class="right-pay-left"></p>
  <p class="right-pay-div">
    支付方式
  </p>
  <p class="right-pay-right"></p>
</div>

css

.right-pay{
  width: 90%;
  height: 50px;
  color: #C9CED5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .right-pay-left{
    width:30% ;
    height: 2px;
    background-color: #caced5;
  }
  .right-pay-right{
    width:30% ;
    height: 2px;
   background-color: #caced5;
  }
  .right-pay-div{
    width: 30%;
    font-size: 30px;
  }
}