Фон тега при отрицательном Margin?

Question

[Alexander Litvinenko]

собственно проблема
https://jsfiddle.net/yu42zLLf/1/

под той часть блока, что налезла на картинку - нет фона.
Надо накатить градиентом поверх, гугл не помог.

Answer 1

[HamSter]

непонятно, но ...

.content {
...
position: relative;
z-index: 100;
...
}

так фон вместе с контентом и отрицательным отступом двигается

Comments

[Alexander Litvinenko]

помогло.

Answer 2

[Михаил Мединский]

.block .content {
  background: rgb(208,228,247);
background: -moz-linear-gradient(top,  rgba(208,228,247,1) 0%, rgba(115,177,231,1) 24%, rgba(10,119,213,1) 50%, rgba(83,159,225,1) 79%, rgba(135,188,234,1) 100%);
background: -webkit-linear-gradient(top,  rgba(208,228,247,1) 0%,rgba(115,177,231,1) 24%,rgba(10,119,213,1) 50%,rgba(83,159,225,1) 79%,rgba(135,188,234,1) 100%);
background: linear-gradient(to bottom,  rgba(208,228,247,1) 0%,rgba(115,177,231,1) 24%,rgba(10,119,213,1) 50%,rgba(83,159,225,1) 79%,rgba(135,188,234,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0e4f7', endColorstr='#87bcea',GradientType=0 );
  color: #fff;
  margin-top: -50px;

display: inline-block
}

Answer 3

[Максим]

Поддержу Hamster https://jsfiddle.net/atlanta/yu42zLLf/2/ просто position:relative;
второй вариант : https://jsfiddle.net/atlanta/yu42zLLf/3/