Wordpress sidebar goes wrong way in bootstrap - wordpress

Question

Basically, i split up the page in 2 columns, and tried inserting sidebar code into the right one (span4). But for some reason, it keeps showing under span8
page code
<div class="row pull-right"><div class="span12" id="hdimg"></div></div>
<div class="row pull-right" id="pgg">
<div class="span8" id="pagecn">
<?php the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-content">
<div class="ttl">
<?php if ( is_singular() ) {echo '<h1 class="entry-title">';} else {echo '<h2 class="entry-title">';} ?><a title="<?php printf( __('Read %s', 'blankslate'), the_title_attribute('echo=0') ); ?>" rel="bookmark"><?php the_title(); ?></a><?php if ( is_singular() ) {echo '</h1>';} else {echo '</h2>';} ?>
</div>
<div id="cn">
<?php the_content(); ?>
</div>
</div>
</div>
</div>
<div class="span4">
<?php if ( is_active_sidebar('primary-widget-area') ) : ?>
<div id="primary" class="widget-area">
<ul class="sid">
<?php dynamic_sidebar('primary-widget-area'); ?>
</ul>
</div>
<?php endif; ?>
</div>
</div>
</div>
<?php get_footer(); ?>
css for it
#hdimg {
width: 948px;
height:185px;
background-image: url(images/banner.jpg);
}
#pgg {
width:948px;
margin-top:4px;
background-color: white;
padding-top: 10px;
padding-bottom: 20px;
}
#cn {margin-top: 15px;}
link to see live
http://soloveich.com/project3/

Answer 1

#pgg {
width:948px;
margin-top:4px;
background-color: white;
padding-top: 10px;
padding-bottom: 20px;
}
Remove width
#pgg {
margin-top:4px;
background-color: white;
padding-top: 10px;
padding-bottom: 20px;
}
I see what you tried to do but you used it incorrectly - fix background in a different way
<div class="" id="hdimg"></div>
This is for your header - remove grid class
change #hdimg width to
hdimg { width: 960px !important; }