歌剧溢出问题css / html

Question

I have a problem with my gradient. The gradient is not displaying wel in opera . What am I doing wrong? see jsfiddle for further code:)

http://jsfiddle.net/KtDTK/7/

<div class="product_1">   
  <div class="product_block">
    <div class="block-gradient">
</div>
  <div class="block-top">
    <div class="text">
  <h4>kenmerk header</h4>
  <div class="kenmerk">
    kenmerk
  </div>
</div>
  </div>
  <div class="block-mid">
    <div class="intro">
  Introduction
</div>
  </div>
  <div class="block-footer">
    <a class="meerinfo" href="/empty.php?p=meerinfo&menuID=1">info</a>
  </div>
</div>  
<div class="order">
  <p><a class="order_text" href="#">Bestellen</a></p>
</div>
</div>`

Answer 1

Decrease height instead of using margin-top: -43px; in your .block-gradient div.

.block-gradient { 
border-radius: 253px 33% 304% 0;
height: 107px;
/*margin-top: -43px;*/
opacity: 0.4;
width: 204px;
z-index: 1;
}