Как сделать затемнение блока div?

не работает. во-первых, бэкграунд не перекрывает картинки в других двух div, во-вторых, бэкграунд не перекрывает белый фон в div с текстом.

denism300,
1. в примере не было (и нет) текста
2. в примере не было (и нет) картинок
3. вам никто не мешает нужные (подлежащие затемнению) классы перечислить через запятую в стилях...

.col-xs-6, col-md-4, col-md-6, col-md-12:hover {background: rgba(0,0,0,.2);}

Также можно родительский, затемняющий div приподнять над остальными потомками при помощи "z-index"-ов...
- И да, как пишет Dymok, т. е. включать псевдоэлемент при ховере - тоже можно.
А если к ховеру добавить ещё и opacity: .4;, то получится, как здесь

Варлам Ерофеич,
1. в примере есть теги p, логично, что между ними что-то есть
2. в примере есть теги img, логично, что там картинка.

denism300,
- Ага... И уж тем более логично, что помощники сами и песочницу для автора вопроса откроют, и "пирожных напекут"...
Кроме того, теги <p></p> достаточно часто применяют пустыми. Откройте любую страницу MDN в редакторе и посчитайте на досуге их количество...
Есть и другие, более оправдывающие себя причины оставлять те или иные теги пустыми. Если интересно - обращайтесь, примеров много и я их приведу. Вот только заведомо, не глядя на сопутствующие скрипты подразумевать, что же несёт в себе пустой html-тег - нелогично...
Пример: <box><div class="box"></div></box> - Давайте же, посоревнуемся в логике... (ответ на этот пример будет позже)

Обещал дать ответ - выполняю обещание:
html
<box><div class="box"></div></box>
css

box{ 
  width: auto; 
  margin: 0;
  padding: 1%; 
  background: #222; 
  border: 4px solid #929292;
  border-radius: 50%; 
  display: inline-block; 
  transform: rotate(-45deg); 
}
.box { 
    margin: .1rem;
    width: 13rem;
    height: 13rem;
    box-sizing: border-box;
    text-align: center; 
    vertical-align: top; 
  border: 5rem solid transparent; 
  border-image: radial-gradient(#bcc, #888 40%, 
        #e62 50%, #2cc 60%, #828 69%, transparent 70%) 15% fill; 
}

Заливаем "сие безобразие" в любую песочницу и зрим, к чему могут привести "пустые теги"...

Если работает, трогать не стоит )

я в курсе про бутстрап. тут приведена упрощенная конструкция.