How to place two divs next to each other with CSS?

Sometimes, we want to place two divs next to each other with CSS.

In this article, we’ll look at how to place two divs next to each other with CSS.

How to place two divs next to each other with CSS?

To place two divs next to each other with CSS, we use flexbox.

For instance, we write

#wrapper {
  display: flex;
  border: 1px solid black;
}

#first {
  border: 1px solid red;
}

#second {
  border: 1px solid green;
}

to make the element with ID wrapper a flex container with display: flex;.

Then we the divs with IDs first and second which are in the element with ID wrapper will be placed side by side.

Conclusion

To place two divs next to each other with CSS, we use flexbox.