2020-08-06 css 移动端 一行左边一行文字,右边

2020-08-06  本文已影响0人  流泪手心_521

1.结构

<div class="box">
        <div class="textbox">sdfsd</div>
        <div class="rtbox">
            <span>提前10分钟</span>
            <span>提前20分钟</span>
            <span>提前30分钟</span>
            <span>提前40分钟</span>
            <span>提前10分钟</span>
            <span>提前20分钟</span>
        </div>
    </div>

2.css

.box{
            display: flex;
            align-items: center;
            background: #ccc;
            padding: 20px;
        }
        .textbox{
            background: red;
            vertical-align: baseline;
            display: inline-block;
            width: 60%;
        }
        .rtbox{
            background: green;
            display: table-cell;
            width: 40%;
        }
        .rtbox span{
            display: inline-block;
            background: yellow;
            width: 50%;
            float: left;
        }
上一篇 下一篇

猜你喜欢

热点阅读