5

left ルールを追加すると、動作が大幅に変わるのはなぜですか? デフォルトの位置を基準にして配置することは可能ですか?

http://jsfiddle.net/suzancioc/drDn3/6/

HTML:

    <div class='level0'>
   <div class='level1'>
       Hello

   </div>
   <div class='level1'>
       Hello
       <div id='inner2'>inner2</div>
   </div>
       <div class='level1'>
       Hello
       <div id='inner3'>inner3</div>
   </div>

</div>

CSS:

.level0 {
   height:40px;
   width: 500px;
   background:red;
}
.level1 {
   float:left;
   margin:2px;
   border-style: solid;
   background: cyan;

}
#inner1 {
   position: absolute;
   background: green;
}

#inner2 {
   position: absolute;
   background: green;
    left:0px;
}

#inner3 {
   position: absolute;
   background: green;
}
4

1 に答える 1

12

絶対的なものを配置するには、その div (あなたの場合) を相対的に配置された親に割り当てる必要があります

.level1 {
   float:left;
   margin:2px;
   border-style: solid;
   background: cyan;
   position:relative;

}

追加position:relativeすると.level1、その中のすべての要素に対して一種の座標系が作成されます。

このJSFIDDLEを見てください

于 2012-11-23T20:52:42.277 に答える