We have an unordered list that will display up to 10 items. How can we setup the list so that it will place the first five items on the left and put the next five items into the next column (splitting equally)?
Here is the current and desired output. We tried to use CSS Flexbox, but cannot find a way to do it. Open to other ideas if flexbox cannot get it done.
Here is the current results and desired outputs.
ul { display: flex; flex-direction: column; flex: 0 1 auto;}
<div><ul><li>Assertively mesh</li><li>client-centered</li><li>niches and covalent networks</li><li>Uniquely e-enable</li><li>team driven benefits</li><li>rather than exceptional</li><li>architectures Continually</li><li>foster cutting-edge</li><li>open-source core</li><li>process-centric</li></ul></div>