When the height property is set on a multicolumn block, each column will be only to that height and no further before a new column is added. The browser starts with the first column and creates as many columns as necessary, creating only the first column if there is minimal text. Finally, if too little space is allocated, the content will overflow from the box—or be clipped if overflow: hidden; is set.
To declare a height on your element, but would also like the content to be spread across your columns, you can use the column-fill property. The browser will balance the height of the columns as though there were no height declared.
