byte-sailing-new/src/views/process/processApproval/auxiliary.vue

<template>
    <div class="auxiliary">
        <ul>
            <li>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
            </li>
            <li>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
            </li>
            <li>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品123asdasd1231啊实打实大苏打阿三大熬是的</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
                <div class="list-box">
                    <div class="label">货币类型：</div>
                    <div class="value">产品</div>
                </div>
            </li>
        </ul>
    </div>
</template>

<style lang="scss">
    .auxiliary{
        ul{
            padding: 0;
            margin: 0;
            li{
                list-style:none;
                padding: 15px 15px;
                background: #f1f1f1;
                overflow: hidden;
                margin-bottom: 10px;
                .list-box{
                    float: left;
                    width: 50%;
                    padding:0 5px;
                    box-sizing: border-box;
                    .label{
                        width: 70px;
                        text-align: right;
                        color: #666;
                        font-size: 14px;
                        float: left;
                        line-height: 30px;
                    }
                    .value{
                        flex: 1;
                        float: left;
                        font-size: 14px;
                        line-height: 30px;
                        color: #333;
                        width: calc(100% - 70px);
                    }
                }
            }
        }
    }
</style>