How to stack divs on top of each other with CSS?

Spread the love

Sometimes, we want to stack divs on top of each other with CSS.

In this article, we’ll look at how to stack divs on top of each other with CSS.

How to stack divs on top of each other with CSS?

To stack divs on top of each other with CSS, we set them to have absolute position.

For instance, we write

<div class="outer">
  <div class="inner">1</div>
  <div class="inner">2</div>
  <div class="inner">3</div>
  <div class="inner">4</div>
</div>

to add multiple divs.

Then we write

.inner {
  position: absolute;
}

to make the inner divs have absolute position so that they stack on top of each other.

Conclusion

To stack divs on top of each other with CSS, we set them to have absolute position.

Leave a Reply

Your email address will not be published.