how do i add div2 to div1 in closed css?

For positioning elements like that, I’d recommend to use position property. And for responsiveness, you can use media queries. Make first div, as relative so that, second div gets positioned according to it, as absolute positioned elements gets positioned according to the closest positioned ancestor element.

PS: Let know in case you got a question 🙂

div {
  border: 1px solid;
}

.div1 {
  position: relative;
  width: 40vw;
  height: 50vh;
}

.div2 {
  position: absolute;
  bottom: 0;
  left: 100%;
  width: 30vw;
  height: 25vh;
}

<div class="div1">
  <div class="div2"></div>
</div>