How do I keep two divs on the same line?

You can make two divs inline this way:

display:inline;
float:left;

For me, this worked much better, as it didn't eliminate spacing between floated items:

display:inline-block;

In case that helps anyone else.


Add this to the container div

.container_class {
    display: flex;
    justify-content: center;
}

Simple do display: inline-block on both div's but be sure and set min-width and max-width both. Example below:

div {
  max-width: 200px;
  min-width:200px;
  background:grey;
  display:inline-block;
  vertical-align: top;
}
<div>
  <p>test</p>
  <p>test</p>
  <p>test</p>
  <p>test</p>
  <p>test</p>
  <p>test</p>
</div>

<div>
  <p>test 2</p>
  <p>test 2</p>
  <p>test 2</p>
</div>