Home » Html » Position DIV relative to another DIV?

Position DIV relative to another DIV?

Posted by: admin November 30, 2017 Leave a comment

Questions:

Is it possible to position a DIV relative to another DIV? I imagine this can be done by first placing it inside of the reference DIV, and then using position: relative. However, I can’t figure out how to do this without affecting the contents of the reference DIV. How can I do this properly?

See: http://jsfiddle.net/CDmGQ

Thanks! =)

Answers:

First set position of the parent DIV to relative (specifying the offset, i.e. left, top etc. is not necessary) and then apply position: absolute to the child DIV with the offset you want.
It’s simple and should do the trick well.

Questions:
Answers:

You need to set postion:relative of outer DIV and position:absolute of inner div.
Try this. Here is the Demo

#one
{
    background-color: #EEE;
    margin: 62px 258px;
    padding: 5px;
    width: 200px;
    position: relative;   
}

#two
{
    background-color: #F00;
    display: inline-block;
    height: 30px;
    position: absolute;
    width: 100px;
    top:10px;
}​

Questions:
Answers:

You want to use position: absolute while inside the other div.

DEMO

Questions:
Answers:

you can use position:relative; inside #one div and position:absolute inside #two div.
you can see it