不想努力的程序员 2022-08-03 19:12 采纳率: 52.1%
浏览 271
已结题

radio 不能垂直居中,如何修改css

uniapp开发小程序时,使用radio-group,出现选框和选项虽然在一行内,但是不能居中,这个如何修改呢?代码如下


    <radio-group>
                    <label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in addressList" :key="index"  @click="chooseAddress(item)">
                        <div class="radio-icon">
                            <radio :value="item.id"  :checked="item.defaultAddress" />
                        </div>
                        <div class="single-address-item">
                            <div class="address-item">{{item.clientArea}}{{item.clientAddress}}
                                
                                <div v-if="!item.flash&&item.addBounty" class="address-item-flash">(距默认地址{{item.kilometers}}公里,每公里追加赏金{{item.bountyNumber}}元)</div>
                                <div v-if="item.flash" class="address-item-flash">(需要叫闪送)</div>
                                <div v-if="!item.flash&&item.bounty!=null&&item.bounty!=''" class="address-item-flash">(赏金{{item.bounty}}元)</div>
                            </div>
                            
                            <div> {{item.clientName}} {{item.clientPhone}}</div>
                        </div>
                        <image src="../../static/image/edit.png" class="edit-image"></image>
                        <div style="height: 20px;width: 100%;"></div>
                    </label>
                    
                    
                </radio-group>

.radio-icon{
        margin-left: 10px;
        display: inline-flex;
        text-align: center;
        
    }
    .single-address-item{
            margin-left: 15px;
            display: inline-block;
            width: 70%;
    }
    .edit-image{
        display: inline-block;
        width: 20px;
        height: 20px;
    }

效果图如下:

img

如何让这个选框垂直居中呢?

  • 写回答

4条回答 默认 最新

  • ZionHH 2022-08-05 09:53
    关注

    调这里的样式uni-list-cell,垂直居中

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 8月18日
  • 已采纳回答 8月10日
  • 创建了问题 8月3日

悬赏问题

  • ¥15 PointNet++的onnx模型只能使用一次
  • ¥20 西南科技大学数字信号处理
  • ¥15 有两个非常“自以为是”烦人的问题急期待大家解决!
  • ¥30 STM32 INMP441无法读取数据
  • ¥15 R语言绘制密度图,一个密度曲线内fill不同颜色如何实现
  • ¥100 求汇川机器人IRCB300控制器和示教器同版本升级固件文件升级包
  • ¥15 用visualstudio2022创建vue项目后无法启动
  • ¥15 x趋于0时tanx-sinx极限可以拆开算吗
  • ¥500 把面具戴到人脸上,请大家贡献智慧,别用大模型回答,大模型的答案没啥用
  • ¥15 任意一个散点图自己下载其js脚本文件并做成独立的案例页面,不要作在线的,要离线状态。