Vertical align list bootstrap

Question

I'm using Bootstrap to make many lists, and my lists have various sizes. I'd like to force them to be sticked under the previous line's list, like "Chapitre 7" on the picture, without care of the size. Does somebody know how to do it ? vertical-align doesn'works...
My code :
<div class="row"> <ul class="col-md-4"></ul> <ul class="col-md-4"></ul> <ul class="col-md-4"></ul> <ul class="col-md-4"></ul> <ul class="col-md-4"></ul> </div>
And the <ul> are having various sizes

EDIT :
Solved with a <div class="clearfix"><\div> every three blocs !

Hi, you need to post some code that replicates the issue so that we have a [mcve] we can work with and solve for you. — Michael Coker, Feb 25 '17 at 17:39
Use a [responsive reset](http://getbootstrap.com/css/#grid-responsive-resets) (AKA clearfix) every 3 `col-*` http://www.codeply.com/go/G4JG4GUSbY — Carol Skelly, Feb 25 '17 at 18:15

score 0 · Answer 1 · answered Feb 25 '17 at 18:03

0

If I understood correctly, you want your list to just be displayed one UNDER the other? (and not side by side?)

If so, try adding a <br> at the end of each <ul> This forces the next element to be in a new line (under the previous one)

I.e-

<div class="row">
    <ul class="col-md-4"></ul><br>
    <ul class="col-md-4"></ul><br>
    <ul class="col-md-4"></ul><br>
    <ul class="col-md-4"></ul><br>
    <ul class="col-md-4"></ul><br>
</div>

answered Feb 25 '17 at 18:03

Shtut

1,397
2
14
28

The problem is the big vertical emptiness between two columns – BDeliers Feb 25 '17 at 18:08

Vertical align list bootstrap

1 Answers1