title: react-beautiful-dnd - adding Lists in next row if more than 4 Lists exist
body: <p>I'm using react-beautiful-dnd to drag and drop team members in different team lists. I have multiple Team lists, and a button which adds a new Team list. After I add 4 teams, I would like the 5th Team List to be on the second row.</p>
  
  <p><a href="https://i.stack.imgur.com/ig8oA.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ig8oA.jpg" alt="enter image description here"></a></p>
  
  <p>Is this possible? If so, how? Currently, it extends horizontally. Re ordering the lists from different rows isn't a priority, however, I would like to be able to drag and drop the team members on Team lists in different rows.</p>
  
  <p>Here is the codesandbox:
  <a href="https://codesandbox.io/s/teamlist-priwp?fontsize=14&amp;hidenavigation=1&amp;theme=dark" rel="nofollow noreferrer">https://codesandbox.io/s/teamlist-priwp?fontsize=14&amp;hidenavigation=1&amp;theme=dark</a></p>