Question

Im using twitter-bootstrap in my rails app

i was following this tutorial : http://untame.net/2012/08/twitter-bootstrap-build-a-stunning-two-column-blog/

and i have the same span 8 main element with a span4 widget sidebar

but for some reasons it looks like this : http://s11.postimage.org/y2cf9wlrn/Bootstrap_Sidebar_fail.png

does anyone know what is going on ? i have tried to increase the container size & lowering the main elements span size but that doesn’t help

btw the app is responsive

here is how my layout file looks

<div class="navbar navbar-inverse navbar-fixed-top">
  #navbar removed for clearer code
</div><!-- end of Navbar -->

<div class="container">

  <div id="myCarousel" class="carousel slide">
     #carousel removed for clearer code
  </div> <!-- Carousel items -->

<div id="user_nav" float="left">      
 #removed for clearer code
</div><!-- Flash messages-->

<div class="row">   
  <div class="span8">

    <div class="hero-unit">
      <!-- page specific content is loaded here -->
      <%= yield %>
    </div>

  </div><!-- end main area -->

  <aside class="span4"><!-- Sidebar starts here  -->    
    <div class="row">

        <div class="widget span4">
           #widget removed
        </div><!-- end widget -->

      </div><!-- end widget row -->
    </aside><!-- end sidebar -->
  </div><!-- end row -->
  #footer removed
</div><!-- end container -->

Answer 1

it seemed like you had some opened div tags that werent closed.. so checking your source for that would help it as the layout you posted seems to be correct