Divs align into each other

I am using here 2 times: col-md-6 to seperate 2 rows. It works but when I have in the first (col-md-6) more than 2 divs, it will override the other col-md-6. I am using the display: inline-flex on both col-md-6 which is probably the case why it is doing this. But I don't know how to solve it. divs into each each other

I want to have something like this but instead of the buttons under each other, next to each other. buttons under each other

Here is the code how I am doing this it is writting in ruby/haml

.container
      .row
        - my_supervisors = current_user.time_keeper_supervisors(@time_keeper)
        - if my_supervisors.count > 1 || my_supervisors.exclude?(@employee)
          .col-md-6
            = panel('Tijdlijnen mijn medewerkers') do
              - my_supervisors.sort_by(&:last_name).each do |supervisor|
                .col-sm-6.col-md-5.col-lg-3.item.icons
                  %a{href: timelines_time_keeper_employee_path(@time_keeper, supervisor.code)}
                    .box.boxAccounts
                      .boxInsiteAccount
                        %i.fa.fa-users.iconSpaceBottom.accountIcon.onlyTextColor
                        %h3.name
                          - if true || can?(:timelines, supervisor)
                            = "Medewerkers #{supervisor.name}"


        - if @employee.subordinates.supervisor.any?
          .col-md-6
            = panel('Tijdlijnen onderliggende medewerkers') do
              - @employee.subordinates.supervisor.sort_by(&:last_name).each do |supervisor|
                .col-sm-6.col-md-5.col-lg-3.item.icons
                  %a{href: timelines_time_keeper_employee_path(@time_keeper, supervisor.code)}
                    .box.boxAccounts
                      .boxInsiteAccount
                        %i.fa.fa-users.iconSpaceBottom.accountIcon.onlyTextColor
                        %h3.name
                          - if true || can?(:timelines, supervisor)
                            = "Medewerkers #{supervisor.name}"