flex space-between doesn't work
You are looking for justify-content: space-between
.
Updated Example
MDN
justify-content
The CSS
justify-content
property defines how a browser distributes available space between and around elements when aligning flex items in the main-axis of the current line. The alignment is done after the lengths and auto margins are applied, meaning that, if there is at least one flexible element, withflex-grow
different than 0, it will have no effect as there won't be any available space.
a {
text-decoration: none;
width: 98px;
height: 40px;
display: flex;
flex-flow: row no-wrap;
align-items: center;
justify-content: space-between;
background-color: lightgray;
}