Question

当我想在中心父div中向左或向右浮动子div时，整个设计向左或向右移动，具体取决于浮动。那么，如何浮动子div并使居中的父div成为中心。

HTML：

<div id="parent">
<div id="child-left"></div>
<div id="child-right"></div>
</div>

CSS：

#parent{
    padding: 0 auto;
    width: 600px;
}
#child-left{
    float: left;
    width: 300px;
}
#child-right{
    float: right;
    width: 300px;
}

为什么父母div左/右，不留在中心？以及如何让它留在中心？

Answer 1

请参阅demo

#parent{
    padding: 0px, auto;
    width: 605px;
  height:200px;
  border:solid 1px #f00;
}
#child-left{
  float: left;
  width: 300px;
  height:200px;
  border:solid 1px #0F0;
}
#child-right{
    float: right;
    width: 300px;
   height:200px;
  border:solid 1px #00F;
}

Answer 2

对于父div，您使用此css代码

margin:0 auto;
width:980px;

对于孩子你使用此代码进行浮动

float:right or left;
width:anypx;

最好的问候

Answer 3

要使父元素居中，请使用margin: 0 auto;

#parent{
    margin: 0 auto;
    width: 600px;
}

您的代码中存在大量拼写错误（智能而非儿童），并且缺少>符号，请在继续之前修复它们

A working JSFiddle (Click me)

如何使div在中心div内左/右浮动

3 个答案: