The task is to display block at center horizontally and vertically inside other block. I use [this code](http://jsfiddle.net/U8wE8/) 

```
<div class="parent">
    <div class="child"></div>
</div>

```

```
.parent {
  background-color: #AFAFAF;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
} 

.child {
  background-color: #FF0000;
  bottom: 0;
  height: 200px;
  left: 0;
  margin: auto;
  position: fixed;
  right: 0;
  top: 0;
  width: 200px;
}

```

and it works great on browsers and iOS devices, but this is the case in mobile android devices (not tablet): the inner div gets pinned to the top left corner, but when I inspect element using Adobe Edge Inspect I see that highlighted area for this inner div is displayed correctly. How can I fix this issue with centering on Android mobile? The size of inner block will change so the desigion should be universal.