Currently the boostrap column distribution is fixed in size 2, example: col-lg-2 , however within that column there is <ul> with several <li> , and when overflow occurs the <ul> is displayed in two columns.
It turns out that when the list is small and <ul> is displayed in only one column, there is space left, and it is misaligned.
I would like to specify the size of the columns dynamically so that everything is correctly aligned.
The <ul> is also generated dynamically using PHP and for overflow to do what is accepted as a response in this question I myself did a few days ago.
I want spaces that are marked in black to be removed when there is no overflow. An example of overflow is in the categories Girl and Baby, when overflow occurs it breaks into two columns.
The size of the columns is set to 2, I would like to dynamically generate them or change them by css when there is overflow.