bootstrapでカラム(col)を入れ替える

bootstrapでカラムの意味はわかったけど・・・

コンテンツ部分を

左カラムに『フェイスブックやツイッター、バナー』

右カラムに『メインコンテンツ』

って使い方よくあります。

でもレスポンシブデザインを取り入れたぜって思っても、スマホで見ると、

twitterやfacebook、バナー

メインコンテンツ

 

っていう順番になる。

パソコンで見ると左にSNSやバナーにしたいけど、スマホで見るときはメインコンテンツの下にしたいっていう時の対処。

 

『push』と『pull』

カラムを左にずらすには

入れ替えたいコンテンツのクラスを下記のように

『class=”col-md-3 col-md-pull-9』

『class=”col-md-9 col-md-push-3』

数字を逆にするとsm(767px)以下になるとコンテンツが左右逆になる。