If I have an element on my website with a relative position, and within that element I want another element with a fixed position.
The Issue:
In various browsers (FF, IE, Opera) and in earlier versions of Chrome (tested on Chrome version 26.0.1410), the fixed element is positioned relative to the parent's relative position. However, in the current version of Chrome (tested on Chrome version 32.0.1700), this fixed child is displayed without considering its parent's relative position.
#parent-element {
border: 1px solid red;
height: 100px;
position: relative;
top: 50px;
width: 90%;
}
#child-element {
background-color: yellow;
height: 100px;
width: 100px;
position: fixed;
}
<div id="parent-element">
<div id="child-element"></div>
</div>