How can I make an element on a webpage fixed BUT relative to another element?

Question

I have an element that is fixed and has a margin from the left of the screen. I want to make this element right of a wrapper instead because people who have smaller resolutions or larger will have the element really far away or really close to my wrapper.

I hope this makes sense! :S

Thanks

Your question really looks like this one. http://stackoverflow.com/questions/6794000/css-fixed-position-but-relative-to-container — username, Apr 15 '12 at 15:34

score 0 · Accepted Answer · answered Apr 15 '12 at 15:39

Using both fixed and relative on the same element is as far as I know impossible.

What you could do is a jQuery solution.

But is the fixed position really necessary? How about fixing the wrapper then just using relative on the other document to position it relative to the wrapper? That should solve it.

score 0 · Answer 2 · edited Jul 02 '13 at 09:48

0

You could use something like this :

HTML

<div id="wrapper">
    <div id="fixed"></div>
</div>

CSS

#wrapper {
    width: 400px;
    height: 600px;
    margin: 0 auto;
}
#fixed {
    width: 40px;
    height: 100px;
    position: fixed;
    top: 0;
    margin-left: 400px;
}

Simple jsfiddle : http://jsfiddle.net/MXgT9/

edited Jul 02 '13 at 09:48

Lukasz Koziara

4,274
5
32
43

answered Apr 15 '12 at 15:45

Martin Gagnon

131
1
3

How can I make an element on a webpage fixed BUT relative to another element?

2 Answers2

Linked