I would like to have AB and C aligned in the middle.
How can I get D to go completely to the right?
BEFORE:
AFTER:
ul { padding: 0; margin: 0; display: flex; flex-direction: row; justify-content: center; align-items: center;}li { display: flex; margin: 1px; padding: 5px; background: #aaa;}li:last-child { background: #ddd; /* magic to throw to the right*/}<ul><li>A</li><li>B</li><li>C</li><li>D</li></ul>