<!DOCTYPE html> <title>flexbox | justify-content: space-around / negative</title> <link rel="author" href="http://opera.com" title="Opera Software"> <style> div { background: blue; margin: 1em 0; border: 1px solid black; height: 8em; width: 17em; position: relative; } span { background: yellow; margin: 1em 0; width: 4em; height: 6em; position: absolute; left: 0.5em; display: inline-block; } span:nth-child(2) { background: pink; left: 6.5em; } span:nth-child(3) { background: lightblue; left: 12.5em; } </style> <div> <span>one</span> <span>two</span> <span>three</span> </div>