Positioning of speakers in bootstrap

Asked

Viewed 846 times

0

I have 3 columns, they are positioned like this:

Dados Basicos | Endereço    
Contato

So when the responsibility is done he gets like this

Dados Basicos
Endereço
Contato

But I need it done this way:

Dados Basicos | Contato
Endereço

So when the responsiveness is done, it stays that way:

Dados Basicos
Endereço
Contato

        <div class="col-xs-12 col-md-6">
            <div class="panel panel-default">
                <div class="panel-body">
                    Dados Basicos
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-md-6">
            <div class="panel panel-default">
                <div class="panel-body">
                    Endereço
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-md-6">
            <div class="panel panel-default">
                <div class="panel-body">
                    Contatos
                </div>
            </div>
        </div>

  • Post all your HTML there to make a test, but I believe that it was enough to change the order, put "contacts" in the place of address and vicexvesa and would already work... I think, so I need the full html and css

  • if I do this, when doing the responsiveness the Contacts panel would be before Address, but I want the order to be Basic Data > Address > Contacts

1 answer

1


Try it like this:

<div class="col-xs-12 col-md-6">
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-body">
                    Dados Basicos
                </div>
            </div>
        </div>
        <div class="col-xs-12">
             <div class="panel panel-default">
                 <div class="panel-body">
                     Endereço
                 </div>
             </div>
        </div>
    </div>
</div>
<div class="col-xs-12 col-md-6">
    <div class="panel panel-default">
        <div class="panel-body">
            Contatos
        </div>
    </div>
</div>

EXAMPLE Jsfiddle

  • Dear Jefferson, that’s what we wanted. Abrass

  • You’re welcome @Henriqueabreu! We’re here to help!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.