[Vuejs]-How to get VueJS transitioning Divs beside eachother?

You could make use of absolute positioning on the div elements, you need to adjust your css a bit though.

But as a starting point, change your .container rules to this (adding position: relative;):

.container {
padding: 40px 80px 15px 80px;
background-color: #fff;
border-radius: 8px;
max-width: 800px;
position:relative;
}

and add this as a new rule below it:

.container div {position:absolute;top:0;left:0;}

The flexbox way:

Change your container rules to this:

.container {
padding: 40px 80px 15px 80px;
background-color: #fff;
border-radius: 8px;
max-width: 800px;
display:flex;
}

After this you can use a css translate rule to position the content. You can see a working example here:

Vue transitions