Как установить два цвета фона для одного элемента в CSS?

Question

Я не знаю, возможно ли это или нет. Я использую bootstrap, и я хочу присвоить классу контейнер-жидкость два цвета фона. 50% черный, а другой 50% красный;

<div class="container-fluid bg-footer-text"> 
    <div class="container"> 
     <div class="col-md-5 left-text"> 
       asdasdsdasd 

     </div> 
     <div class="col-md-7 right-text"> 
      <div> 
       <img src="<?php echo Yii::app()->createUrl("/images/pages/services/img_servicii_qa_1.jpg") ?>" alt="Development" /> 
      </div> 
      <div class="content"> 
     asdsada 
      </div> 
     </div> 
    </div> 
</div> 

Как я могу это сделать? ТНХ

UPDATE

Я не забочусь, что цвет будет иметь класс контейнера

Answer 1

Да, это возможно с использованием линейного градиента.

JSfiddle Backup Demo

.container-fluid { 
 
    width: 80%; 
 
    margin: 0 auto; 
 
    height: 500px; 
 
    background-image: linear-gradient(to right, black, black 50%, red 50%, red); 
 
}

<div class="container-fluid"></div>