收藏
回答

itemBox 背景宽度不统一?


<view class='bg-gray'>

  <view class='main'>

    <text>选择充值金额</text>

    <view class='flex between itemBox'>

        <view class="{{rechangeActiveIndex == index ? 'active':''}}"  wx:for="{{rechangeNumArray}}"  wx:key="{{index}}"  bindtap='activethis' data-thisindex='{{index}}'><div>¥{{item}}</div></view>

    </view>

  </view>





.itemBox{

  display: flex;

  flex-flow: wrap;

}


.itemBox view{

  width: 33.3%;

  box-sizing: border-box;

  margin: 5% auto;

}


.itemBox view>div{

  

  text-align: center;

  padding: 20rpx;

  margin: 10%;

  border-radius: 8rpx;

  background: #eff4f8;

  border: 2rpx solid white;

  color: black;

  font-size: 40rpx;

}


.itemBox view.active>div{

  background: #22a6e4;

  border: 2rpx solid #5cbcfe;

  color: white;

  font-weight: bold;


有两个背景宽度比其他的短,怎么能统一宽度呢

}

回答关注问题邀请回答
收藏

3 个回答

  • 矜持
    矜持
    2021-10-12

    因为没有设置宽度,除非所有内容的长度是一致的就可以不用设置宽度就能保持一致

    2021-10-12
    有用 1
    回复 9
    • 漠远科技@胡
      漠远科技@胡
      2021-10-12
      怎么设置呢
      2021-10-12
      回复
    • 矜持
      矜持
      2021-10-13回复漠远科技@胡
      .itemBox view { flex:0 0 33%}
      2021-10-13
      回复
    • 矜持
      矜持
      2021-10-13回复漠远科技@胡
      为啥你还有div???
      2021-10-13
      回复
    • 漠远科技@胡
      漠远科技@胡
      2021-10-13
      <view class='flex between itemBox'>
              <view class="{{rechangeActiveIndex == index ? 'active':''}}" wx:for="{{rechangeNumArray}}" wx:key="{{index}}" bindtap='activethis' data-thisindex='{{index}}'><div>¥{{item}}</div></view>
          </view>
      2021-10-13
      回复
    • 漠远科技@胡
      漠远科技@胡
      2021-10-13
      itemBox view { flex:0 0 33%}  这样改没效果
      2021-10-13
      回复
    查看更多(4)
  • 靡不有初
    靡不有初
    2021-10-12

    div设置宽高吧,别设置padding

    2021-10-12
    有用 1
    回复 4
  • 微喵网络
    微喵网络
    2021-10-12

    css设置宽度啊

    2021-10-12
    有用
    回复 6
    查看更多(1)
登录 后发表内容