Sort elements on canvas with CSS

0

I'm replicating some buttons with "ng-repeat" with angular, but I'm having trouble sorting those buttons the way I want them. I want to see 4 buttons on the bottom left and 4 buttons on the bottom right. I can not use the slice because it would disturb another time.

HTML code:

.btf {
        color: white;
        font-weight: bold;
        font-size: 20px;
        float: left;
        width: 50%;
        height: 79px;
        background-color: #2E5491;
    }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><div><divclass="page-header" id="principal">
        <div class="divpai">
            <span class="divbutton" ng-repeat="menuItem in teste  = data.alexa.item | filter:  menuSel ">
                <button id="btf1" ng-repeat="menu in menuItem.children.child" ng-click="selecionaMenu(menu['@attributes'].id)" class="btf">{{menu['@attributes'].id | label : mapaLabels}}</button>
            </span>
        </div>
    </div>
</div>
    
asked by anonymous 09.10.2017 / 20:28

1 answer

0

I think using the Bootstrap grid would solve your problem.

<div class="row">
    <!-- Primeira linha com 4 botões -->
    <div class="col-md-3">
        <!-- Botão -->
    </div>
</div>

<div class="row">
    <!-- Segunda linha com 4 botões -->
    <div class="col-md-3">
        <!-- Botão -->
    </div>
</div>

Adapt this code to your need and so should solve your problems.

    
09.10.2017 / 20:35