Richlewis
Richlewis

Reputation: 15374

Spans in Twitter Bootstrap

I am using the following snippet of code to place flex-slider in the center of my page, however when viewing on desktop it seems off center.

<div class="row">
 <div class="span8 offset2">
<div class="flexslider">
   <ul class="slides">
    <li><img src="/assets/toystory.jpg" /></li>
    <li><img src="/assets/walle.jpg" /></li>
    <li><img src="/assets/up.jpg" /></li>
    <li><img src="/assets/nemo.jpg" /></li>
    </ul>
</div><!--End of FlexiSlider-->

</div><!--End of span8 offset2-->
</div><!--End of Row-->

The site can be viewed at http://growing-mist-5023.herokuapp.com/ if needed. is there a reason why this will not sit in the center of the page, am i missing something obvious? is my CSS causing an issue? Any suggestions appreciated.

Upvotes: 0

Views: 952

Answers (1)

baptme
baptme

Reputation: 10092

Simply add your code in a <div class="container"/>

<div class="container">    
  <div class="row">
    <div class="span8 offset2">
      <div class="flexslider">
        <ul class="slides">
          <li><img src="/assets/toystory.jpg" /></li>
          <li><img src="/assets/walle.jpg" /></li>
          <li><img src="/assets/up.jpg" /></li>
          <li><img src="/assets/nemo.jpg" /></li>
        </ul>
      </div><!--End of FlexiSlider-->
    </div><!--End of span8 offset2-->
  </div><!--End of Row-->
</div><!--End of Container-->

Upvotes: 2

Related Questions