小编lis*_*077的帖子

如何将一行中的 3 列居中?

我的页脚有问题:我想要在 div 行内有 3 个居中的列。这是代码。

.col-1 {
    float: left;
    width: 20%;
    padding: 5px;
    height: 100px;
}

.col-2 {
    float: left;
    width: 40%;
    padding: 5px;
    height: 100px;
}
Run Code Online (Sandbox Code Playgroud)
<footer>
    <div class="row bg-black">
        <div class="col-2">
            <div class="social-box">
                <div><p>Connect with us:</p></div>
                <div>
                    <div><img src="assets/twitter.png" alt=""></div>
                    <div><img src="assets/linkedin.png" alt=""></div>
                </div>
            </div>
        </div>
        <div class="col-1">
            <p>dsds</p>
        </div>
        <div class="col-1">
            <p>dsds</p>
        </div>
    </div>

    <div class="row"></div>
</footer> <!-- END FOOTER -->
Run Code Online (Sandbox Code Playgroud)

如果我把float: left柱子放在上面,我的背景就不会显得黑色。

我怎么解决这个问题?它也不适用于 Flex。

css multiple-columns css-float flexbox

1
推荐指数
1
解决办法
4330
查看次数

标签 统计

css ×1

css-float ×1

flexbox ×1

multiple-columns ×1