Fill ion-content with a 100% height div

Question

I am working with ionic and am trying to fill the entire ion-content with a div. Within this div, I want to center a text horizontally & vertically.

I have achieved something, but this seems to only work within the browser, as soon as I upload the APK to my android device, it doesn't work anymore. I believe this is due to this line (please see the codepen I made) :

height: calc(100vh - 120px);

I wish I could use something else to get the full height of the container.

Answer 1

I would try including the -webkit prefix. Both calc() and viewport units should work in Android.

height: -webkit-calc(100vh - 120px);
height: calc(100vh - 120px);

Answer 2

Ok so I have found the solution, I am not sure why I did not find that during my previous searches. So I am basically using that :

myDiv {
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
  height: 10px;
  text-align: center;
  background-color:red;
}

http://codepen.io/bokboki2002/pen/rVyMgE