html - Divs are overlapping, how to fix? CSS -

I want to position two divs under each other, which are below each other.

  Div 1 div 2 -------- | | | | | | | | ---- ----  

What is happening with my code so far is that they overlap like this:

  - - - || || || || -----  

This is my code so far:

  @ media screen and (minimum-width: 40rem) and (max-width: 60rem) {# div1 {status: absolute; Left: 0 pixels; } # Div2 {status: absolute; Correct: 0 pixels; }}  

As you can see that I want to put div # div2 on the right, while the other one is on the left side, apart from this, I should do this when the browser window 40 and 60 The width of the RAM is between the width.

But they overlap with my code, I want them to be kept side by side smoothly.

It would be nice if I could get some help.

please try the following:

  @ media screen and (minimum -Width: 40rem) and (max-width: 60rem) {# div1 {float: left; Width: 200px; / * Change this value to your needs * /} # div2 {float: right; Width: 200px; / * Change this value to your needs * /}}  

Next time, this will be helpful in providing an example of your code

< / Div>