絕對定位的孩子忽略相對父親

Question

我知道有很多關於定位的問題，包括關於相對父母的絕對定位。

我已經閱讀了很多這些問題，並在css-tricks（Absolute positioning inside relative parent）上找到了有用的鏈接。畢竟排除故障後，我轉向你;）

This JSFiddle包含我認爲是對的，但顯然不是。 爲什麼父div的子元素相對於身體而不是div定位？

代碼：

<div id="editorWrapper" style="posotion: relative; width:751px; height:250px; margin-left: 20px; margin-top: 20px; border: 1px solid blue;"> 
    <a class="lnk" href="http://www.google.be" style="display: inline-block; position:absolute; left: 1%; top: 1%; padding: 5% 5%;"></a> 
    <a class="lnk" href="http://www.google.be" style="display: inline-block; position:absolute; left: 80%; top: 80%; padding: 10% 10%;"></a> 
    <div style="position: absolute; padding: 10px; left: 60%; top: 60%; background-color: red;" /> 
</div> 

編輯 答案只是一個錯字。應該在父分格中定位。 對於未來的參考：這種定位方法確實工作:)

謝謝Gaurang！

Answer 1

注意：您已在div#editorWrapper的style屬性中編寫了posotion: relative。應改爲position: relative。

Fixed Fiddle