Make a div stretch across the page overflowing its containing div - html

Question

I am having difficulty making a div stretch across the page overflowing its containing div.
I am using WordPress child theme of twenty thirteen theme importing bootstrap CSS file only, no JavaScript files (yet anyway!).
I am using this div called section to add styling just to add a background image or colour like this websites orange section please see link below:
Flat Web Design
I have tried
position: absolute;
left: 0;
right: 0;
but position: absolute seems to play havoc with the grid.The section div appears in the correct place, however the following divs sit on top of the "section" div.
I am aware of HTML5 section tag. But as I understand it, it is not best practice to use section for styling only, but to use a div instead? However I have experimented with the section tag and I have the same problem.
I hope someone can advise how I can make a div stretch across the page overflowing its containing div? Can this be done without position absolute?
Thanks in advance
My MarkUp
<div id="content" class="site-content" role="main">
<div class="entry-content">
<div class="container">
<div class="section">
<div class="row">
<div class="col-md-4">
<?php the_field('title'); ?>
</div>
<div class="col-md-4">
<?php the_field('content'); ?>
</div>
<div class="col-md-4">
<?php the_field('image-item'); ?>
</div>
</div>
</div>
</div>
</div>
</div>
My CSS
.entry-header,
.entry-content,
.entry-summary,
.entry-meta{
margin: 0 auto;
max-width: 1150px;
width: 95%;
}
.section{
background:#e8e5ce;
position:absolute;
left:0;
right:0;
}

Answer 1

To achieve this kind of layout you can't use a single container, each section should have its own .container element, this way the section covers the width of the window but the content is centered:
HTML
<div class="section">
<div class="container">
<div class="row">
<div class="col-md-4">
<?php the_field( 'title'); ?>
</div>
<div class="col-md-4">
<?php the_field( 'content'); ?>
</div>
<div class="col-md-4">
<?php the_field( 'image-item'); ?>
</div>
</div>
</div>
</div>
CSS
.section{
background-color:#e8e5ce;
}