2016-04-13 4 views
0

私はこのテンプレートに基づいてウェブサイト上で作業しています http://startbootstrap.com/template-overviews/modern-business/私はカルーセルの真ん中、スライドの上にイメージを置くことができません。イメージカルーセル上のブートストラップ

これは私がこれまで何をやったかである:

<div style="position:absolute; top:50px;"> 
     <div class="container"> 
     <div class="row"> 
      <div class="col-md-4"> 
      <img src="logo.png" class="img-responsive"> 
      </div> 
     </div> 
     </div> 
</div> 

画像がはるかにカルーセルの左側に残り、それも他の解像度でそのように滞在しないだろう、私は何ができるのでしょうか?

答えて

0

親のdivに位置/スタイルを追加する必要はありません。 containerクラスを使用している場合、divの幅が設定されます。

ブートストラップでロゴの位置を変更する場合は、col-size-offset cssクラスで再生する必要があります。これはあなたのcol-md-4 divの内側に何があるか4列からオフセットされていることを意味

<div> 
    <div class="container"> 
    <div class="row"> 
     <div class="col-md-4 col-md-offset-4"> 
     <img src="logo.png" class="img-responsive"> 
     </div> 
    </div> 
    </div> 
</div> 

:そのブートストラップを知る がほぼ中央に、12列のレイアウトで、あなたのようなものになってしまいます。私たちが欲しいものは何ですか。 Tereはロゴの左側に4列、ロゴのdivに4列(センタリングをもう少しする必要があるかもしれません)、そして右側に4列あるので残っています。

オフセットの詳細については、http://getbootstrap.com/css/#grid-offsetting

を参照してください。
関連する問題