ブートストラップ、要素を積み重ねるときにcolの順序を変更する方法は？このコードでは</p> <p><a href="https://i.stack.imgur.com/qLWdX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qLWdX.png" alt="this"></a></p> <p>：私はこのようになりますフッターを持って

Question

<div class="row" style="font-size: 70%;padding-bottom:1%;margin-bottom:1%;"> 

    <div class="col-lg-offset-1 col-lg-2" style="color:grey"> 
     Copyright 2017 SoContact 
    </div> 


    <div class="col-lg-offset-2 col-lg-2" style="padding-right: 0px;margin-right: 0px;"> 
     <a href="mentions.php" style="color:grey">MENTIONS LEGALES</a> 
    </div> 

    <div class="col-lg-1" style="padding-left: 0px;margin-left: 0px;"> 
     <a href="cgv.php" style="color:grey">CGV</a> 
    </div> 

    <div class="col-lg-1" style="padding-left: 0px;margin-left: 0px;"> 
     <a href="faq.php" style="color:grey">FAQ</a> 
    </div> 

    <div class="col-lg-1" style="padding-left: 0px;margin-left: 0px;"> 
     <a style="color:grey">actualités</a> 
    </div> 

    <div class="col-lg-2" style="padding-left: 0px;margin-left: 0px;"> 
     <span class="glyphicon glyphicon-envelope"></span> &nbsp;<a style="color:grey">CONTACTEZ-NOUS</a> 
    </div> 
    <br> 

</div> 

にはフッター項目の順序がされるスマートフォン：

Copyright 2017 SoContact 
MENTIONS LEGALES 
CGV 
FAQ 
actualités 
CONTACTEZ-NOUS 

しかし、ステイキングするときに注文を変更する必要があります。

FAQ 
CONTACTEZ 
ACTUALITES 
MENTIONS LEGALES 
CGV 
Copyright 2017 SoContact 

col-sm-pushとpullで試してみましたが、適切な組み合わせが見つかりませんか？

ヒント？

あなたは

Answer 1

あなたはpush and pullで列の順序を変更することができますありがとうございました。

ブートストラップ4では、これはpush-viewport-unit/pull-viewport-unitになっています。

これは私の最強のポイントはありませんが、私はあなたの場合にはそれがあると思います：

<div class="row" style="font-size: 70%;padding-bottom:1%;margin-bottom:1%;"> 

    <div class="col-lg-2 push-lg-10" style="color:grey"> 
     Copyright 2017 SoContact 
    </div> 


    <div class="col-lg-2 push-lg-4" style="padding-right: 0px;margin-right: 0px;"> 
     <a href="mentions.php" style="color:grey">MENTIONS LEGALES</a> 
    </div> 

    <div class="col-lg-1 push-lg-4" style="padding-left: 0px;margin-left: 0px;"> 
     <a href="cgv.php" style="color:grey">CGV</a> 
    </div> 

    <div class="col-lg-1 pull-lg-4" style="padding-left: 0px;margin-left: 0px;"> 
     <a href="faq.php" style="color:grey">FAQ</a> 
    </div> 

    <div class="col-lg-1 pull-lg-2" style="padding-left: 0px;margin-left: 0px;"> 
     <a style="color:grey">actualités</a> 
    </div> 

    <div class="col-lg-2 pull-lg-5" style="padding-left: 0px;margin-left: 0px;"> 
     <span class="glyphicon glyphicon-envelope"></span> &nbsp;<a style="color:grey">CONTACTEZ-NOUS</a> 
    </div> 
    <br> 

</div>