Is there a better way than the following to make equal sized columns no matter the content size using flexbox?

ul {
  display: flex;
}

li {
  flex-basis: 30%;
  flex-grow: 1;
}

Challenge link (Layout two): https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox_skills