Bootstrap 3: Расширение div снаружи контейнера на правой стороне

Question

Я пытаюсь сделать макет, который нуждается в div, чтобы расширить его за пределами div .container только с правой стороны.

Вот скрипка: http://jsfiddle.net/krish7878/c5n365ek/1/

HTML код:

<div class="container"> 
    <div class="row"> 
     <div class="col-lg-6 col-md-6 col-sm-6 left"> 
      Left Container 
     </div><!-- /.col-6 --> 
     <div class="col-lg-6 col-md-6 col-sm-6 right"> 
      Right Container 
     </div><!-- /.col-6 --> 
    </div><!-- /.row --> 
</div><!-- /.container --> 

CSS код:

.left{ 
    background-color: #999; 
    height: 50px; 
    padding: 30px 0px; 
} 
.right{ 
    background-color: #49c8ff; 
    height: 50px; 
    padding: 30px 0px; 
} 

Я хочу, чтобы правый контейнер с синим фоном продлить на правой стороне полностью.

Answer 1

Вы хотите что-то ищите? Вам просто нужно сделать .containerwidth:100% и вы можете добавить padding-left

.container{ 
    width: 100%; 
    padding-left: 120px; //whatever you want 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box; 
} 

FIDDLE