html - Relative parent ignored with absolutely positioned children -
i know there lot of questions positioning out there, including absolute positioning inside relative parent.
i've read many of these questions , found informative link on css-tricks (absolute positioning inside relative parent). after troubleshooting fails, turn ;)
this jsfiddle contains think right, isn't. why child elements of parent div positioned relative body , not div?
code:
<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>
edit answer typo. posotion should position in parent div. future references: positioning methods in fact work :)
thanks gaurang!
take note: have written posotion: relative
in style attribute of div#editorwrapper
. should position: relative
instead.
Comments
Post a Comment