研究下拉菜單和彈出菜單時比較所得：
1.直接在css中設置left生效的前提是必須設置父容器position:absolute或relative，如果不設置則會顯示為最近一個定位的父對象左邊相關的位置：
測試代碼:
1 <div style="position:relative;top:100px;left:100px;border:1px solid blue;width:100px;height:100px;"> 2 <div id="outer" style="position:relative;margin-top:25px;margin-left:25px;width:50px;height:50px;border:1px solid red;"> 3 <div id="inner" style="position:absolute;left:15px;top:15px;width:25px;height:25px;border:1px solid green;"></div> 4 </div> 5 </div>
測試效果：
不設置紅線框的position，設置藍線框的position，綠線框的位置：
設置紅線框的position，設置藍線框的position，綠線框的位置：
2.設置margin-left則只會出現在父對象的左邊的相對位置，不考慮是否設置了position。
測試代碼：
1 <div style="position:relative;top:100px;left:100px;border:1px solid blue;width:100px;height:100px;"> 2 <div id="outer" style="position:relative;margin-top:25px;margin-left:25px;width:50px;height:50px;border:1px solid red;"> 3 <div id="inner" style="position:absolute;margin-left:15px;margin-top:15px;width:25px;height:25px;border:1px solid green;"></div> 4 </div> 5 </div>
不設置紅線框的position，設置藍線框的position，綠線框的位置：
設置紅線框的position，設置藍線框的position，綠線框的位置：
3.設置margin-right無法起到將element定位到右邊相距XX位置，但設置right可以。
測試代碼:
<div style="position:relative;width:98px;height:63px;background-image:url('images/pic.png');margin-left:100px;margin-top:300px;">
<img src="images/delete.gif" style="position:absolute;top:-10px;right:-5px;"/>
</div>
測試效果：
設置margin-right
設置right
申明：此文非本人原創，引用自http://blog.csdn.net/tomatozq/article/details/7178144