Bootstrap как это правильно провернуть, игры с fluid & container?

Question

[Гарес Антонович]

Есть стандартный контейнер по бутстраповской сетке, есть контейнер флюид, как правильно совместить эти 2 вещи?

Есть блок который должен быть на всю ширину экрана, но контент который в нем находиться должен быть привязан к сетке обычного контейнера 1200px.

Блок который 66% это картинка которая будет потом пропадать на планшете но до 1200 пикселей она должна просто обрезаться в зависимости от ширины экрана.
Блок 33% будет занимать всю ширину(лучше посмотрите в наглядном примере) но опять же контент в нем будет привязан к обычной сетке, а сам блок 33 будет залит цветом.

Более наглядный пример

Это что бы было более понятно что у меня за мухи

Answer 1

[kapitansen]

.container-fluid {
  background: #ccc;
}

.container {
  position: relative;
  overflow-x: visible;
  background: #ccc;
}

img {
  position: absolute;
  right: 0;
}


<div class="container-fluid">
  <div class="container">
    <div class="col-lg-7 hidden-md hidden-sm hidden-xs">
      <img src="https://www.mirf.ru/wp-content/uploads/2017/05/nwVtQ2E2YBI.jpg" alt="">
    </div>
    <div class="col-lg-5 col-md-12">
      Some content....
    </div>
  </div>
</div>

Comments

[Гарес Антонович]

Отлично, спасибо!