如何居中对齐具有父div的两个div [英] How to center align two divs having a parent div

问题描述

如果我的父div中有两个div，而所有三个div都向左浮动.我要做的是将两个子div居中对齐，而又不去除左浮点数.

If I am having two divs in a parent div and and all three divs have float left. What I have to do is to align center the two child divs without removing float left.

推荐答案

此布局可能会帮助您:

HTML

<div class="div-p">
    <div class="div-1"></div>
    <div class="div-2"></div>
</div>

CSS - 演示

.div-p{background-color:#eee;width:640px;height:400px;float:left;}
.div-1{background-color:#f00;width:300px;height:300px;float:left;margin:10px;}
.div-2{background-color:#0f0;width:300px;height:300px;float:left;margin:10px;}

如果要使父 div 居中，则使用 margin:0 auto; 并删除 float:left;

If you want to center the parent div then use margin:0 auto; and remove the float:left;

CSS - 演示

.div-p{background-color:#eee;width:640px;height:400px;margin:0 auto;}
.div-1{background-color:#f00;width:300px;height:300px;float:left;margin:10px;}
.div-2{background-color:#0f0;width:300px;height:300px;float:left;margin:10px;}

这篇关于如何居中对齐具有父div的两个div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！