DIV position relative to DIV content without moving other stuff

[I'm not sure if this question was asked, although I did look around a bit.]

I have a DIV inside a DIV. I would like the inner DIV to have a specific position inside the outer div. I have some success with this

position: absolute; top: 0px;right:0px;

but all other divs move around. I just want it to be float

on top of other things (float didn't work of course).

Thanks!

Edit: The outer div is relative and I would like the inner to move with it when the browser resizes.

Edit: Sorry, I figured out the question (but not the answer): if I use: 0px correctly, the inner div stops moving relative to the outer div and starts moving relative to the browser window. Why would that be?

+2


a source to share


2 answers


Use position: absolute

for inner element. If your outer element is relatively positioned as you say you can set the position based on the top left corner of the outer element.



+3


a source


If you apply relative positioning to the outer div

Then absolute positioning to the inner div, your inner div will be positioned relative to the outer div.



(top: 0; left: 0 will be somewhere to the left of our outer div.

<div>other Div</div>
<div style="position:relative;">
    <div style="position:absolute; top: 100px;">Abs Div</div>
</div>

      

+2


a source







All Articles