Overflow hidden not working on Android

Question

I have a picture displaying in a DD which has rounded corners. When I build it and get it on an android device the overflow:hidden doesn't work and the full picture shows over the dd. Anyone else have this issue and know a workaround/fix?

This is the CSS for the DD.

.empImage {
    position:absolute;
    width:90px;
    height:110px;
    top:0;
    right:0;
    overflow: hidden;
    background-color: #eaeaea;
    border: #f26122 solid thin;
    -moz-border-radius: 15px;
    border-radius: 25px;
    -moz-box-shadow: -5px 0px 5px #666;
    -webkit-box-shadow: -5px 0px 5px #666;
    box-shadow: -5px 0px 5px #666;
}

Answer 1

Overflow:hidden doesn't work on android when the element is relative or absolute position.

The simplest workaround is to have an outer element with relative/absolute and an inner element with the overflow.

<div style="position:absolute">
  <div style="width:100%; height:100%; overflow:hidden">
    <img>
  </div>
</div>