I have a container div that lists out an arbitrary number of elements.
When the number of elements do not fit in a row, then it should appear in a new row.
How can that be done?
You can use word-break if not using flex or grid
.container {
width: 100px;
border: 1px solid green;
word-break: break-all
}<div class='container'>wdiwbybwidbweibdiewbiwebiwebduewbduyewbuwebduwebweubuwebduewbdubweudbweubduwebuewbdewbewbiewbiwebdwehid</div>