How to align 4 divs to the right of each other in another div

Question

I want to place 4 divs next to each other at a specific position in the parent div. So the div structure is this (I'll call the top of the div diviv):

<div>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
</div>

now i want to set div with text '1' on the left in maindiv

now I want to set the div with text '2' to 50 px on the left side in maindiv

now i want to set div with text '3' at 150 px on the left side in maindiv

now I want to set the div with the text “4” to 200 px on the left side in maindiv

I think :-) I tried ALL possible css constructs, but that didn't work, unfortunately.

Any idea?

Answer 1

Give the position: relativemain div

position: absolute left: xyz; top: xyz.

Answer 2

, .

                <div> 
                    <div style="float: left;">1</div> 
                    <div style="float: left; margin-left: 50px;">2</div> 
                    <div style="float: left; margin-left: 100px;">3</div> 
                    <div style="float: left;margin-left: 50px;">4</div> 
                </div>

Answer 3

:

 div div
      {
          float:left;
          margin-left:50px;
      }

EDIT: : :

div
{
    float:left;
    margin-left:-50px;
}
div div
{
    float:left;
    margin-left:50px;
}