如何在float中完全放置：left？

Question

爲什麼添加左邊的規則會如此劇烈地改變行爲？有可能相對於默認位置進行定位嗎？

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; 
} 

Answer 1

爲了定位需要分配該分區（在你的情況下）絕對的東西，相對定位的父

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

} 

添加position:relative使得.level1成爲其內部所有元素的一種座標系。

看看this JSFIDDLE