4


中央の親 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が左右に移動し、中央に留まらないのはなぜですか? そして、中心にとどまるようにする方法は？

4

3 に答える 3

6

デモを見る 

#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;
}
于 2012-10-10T13:47:03.877 に答える
3

親 div には、この css コードを使用します

margin:0 auto;
width:980px;

子uの場合、フロートにこのコードを使用します

float:right or left;
width:anypx;

よろしくお願いします

于 2012-10-10T13:44:59.227 に答える
1

親要素を中央に配置するには、次を使用しますmargin: 0 auto;

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

また、コードには多くのスペルミス (chile not child) があり、>シンボルが欠落しています。続行する前に修正してください。

動作中の JSFiddle (クリックしてください)

于 2012-10-10T13:44:57.867 に答える