Как поставить текст поверх размытой картинки?

Question

[Qairat]

Всем Привет!
Не могу поставить текст поверх размытой картинки.
Посмотрите пожалуйста, вот ссылка на код...
Спасибо.

Comments

[Qairat]

не надо изменять html code, если возможно...

Answer 1

[Сергей Жубартович]

Текст находится внутри блока с filter: blur и поэтому он тоже размывается.
Нужно верстку сделать что-то типа:

<div class="news-image">
  <div class="news-blur" style="background: url(http://placehold.it/150x150);"></div>
  <div class="text-overlay"></div>
  <div class="news-title"><a href="#">Заголовок</a></div>
  <div class="news-date">24.02.2017</div>
</div>

И размывать не весь блок, а .news-blur