收藏
回答

边框里的多行文本无法完全水平居中问题

问题模块 框架类型 问题类型 终端类型 微信版本 基础库版本
框架 小程序 需求 工具 6.6.7 2.3.0

一个长方形边框里的多行文本无法完全水平居中问题,具体如下:


多行文本时,文本框里的右边红色箭头那里就会留白多一点,无法完全水平居中,如图:




删掉换行的那些字,变成单行文本的时候,左右的留白是一样的,是可以完全水平居中的,如图 :


- 请问各位大神们,这是什么原因呢?我想要完全水平居中,怎么解决这个问题呢?

代码如下:

//.wxml

<view class="action-deposit-container">

<view class='deposit-lead'>

<view class='deposit-lead-border'>

<text class="deposit-lead-text">一旦你停止思考,你就只能沿着已有的路径前进,或者,原地不动。</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;

}


.deposit-lead-border{

display: flex;

justify-content: center;

align-items:center;

box-sizing:border-box;

border-radius: 5px;

border: 1rpx solid #8a8a8a;

width: 90%;

height: 160rpx;

margin-top: 20rpx;

padding: 20rpx 20rpx;

}


.deposit-lead-text{

color: #8a8a8a;

font-size: 34rpx;

}


最后一次编辑于  2018-09-27
回答关注问题邀请回答
收藏

1 个回答

  • united7
    united7
    2018-09-27
    align-items:  center


    2018-09-27
    赞同
    回复 1
    • Jeremy
      Jeremy
      2018-09-27
      align-items:  center

      有写这行啊


      2018-09-27
      回复