I find this impossible to achieve

I'm trying to horizontally align an arbitrary number of <li> elements so they're all the same width as the widest one, and so they wrap to a new line when needed.

I need to do this without hardcoding any values in the CSS.

Here is my CodePen: https://codepen.io/cos4ni2s/pen/KwdBVyz?editors=1100

EDIT
The <ul> container should be as wide as its content. Something like width: fit-content;
Was this page helpful?