Question

I have a div inside a div inside a div … By default each comtainer moves elements more and more to the right.

I have a elements "div.leftPanel" that can be nested very deeply in but I want it to be 50px (for args sake) to the left of the document (where the body’s left property would be) and not it’s parent element. Some of it’s containers need to have a position of absolute or relative.

Is there any way to do this with css? if not then javascript?

Answer 1

You could use a negative margin to achieve this if you already know how far the nested div has been pushed out from the left of the body. Example:

<div style="position:absolute; left: 30px;">
    <div style="position:absolute; left: 30px;">
        <div style="position: relative; margin-left: -10px;">
        </div>
    </div>
</div>

If it isn’t set, you can always find out how far from using javascript and apply the margin dynamically.