How to place a div relative to another div?

Good afternoon. Please tell me how to place one div with reference to the other. For example, two diva

<div id="outer" style="width: 500px; height: 500px"> 
Inside this large block of div lies a smaller size
</div>
<div id="inner" style="width: 250px; height: 250px">
Little divas
 </div>


The first obvious answer is to nest one div in another, but this is not possible.
Is there a way to bind the upper left corner of a small and a big Diva, and of admarginal small div to 25px and top left.

Options with pos: abs and pos: rel is not suitable. If you need to resize the screen to the binding remained.
July 9th 19 at 10:10
2 answers
July 9th 19 at 10:12
Solution
In fact small will not be invested in large, and will be based on it in your case.
Why position is not suitable?
https://jsfiddle.net/slippyk/c638Lg34/
Something that is necessary. Didn't think about that possible third div itility) - dannie commented on July 9th 19 at 10:15
July 9th 19 at 10:14
Why are you twisting arms? Possible position: absolute and difficult, but position: relative self - otherwise nothing...
Slide the block up and to the left of the first block:
#inner
{
 position: relative;
 top: -475px;
 left: 25px;
}

or this:
#inner
{
 position: relative;
 margin-top: 25px;
 margin-left: 25px;
 top: -500px;
}

Find more questions by tags CSSHTML