Victor Fagerström
Posts: 0
Joined: Sun Dec 01, 2013 1:03 pm

Centering content vertically works in browsers but not in Xcode simulator or Appery.io Tester

In my app I use this code to center a div with content vertically:

//contdiv is a div with the size of mobilecontent.
$(window).load(function (){
var contdiv = $('.contdiv');
var contdivHeight = +$(contdiv).height();
var contdivHeight2 = contdivHeight / 2;
var contdivHeight3 = contdivHeight2 - contdivHeight;
//contentdiv is the div with content that should be centered on page.
Appery('contentdiv').css('position', 'absolute');
Appery('contentdiv').css('top', '50%');
Appery('contentdiv').css('margin-top', contdivHeight3);
});

It works as expected in all web browsers and mobile browsers but the code does nothing in appery.io tester on mobile or in Xcode simulator.

I have tried running code on pageshow event etc but only the above solution gets the right height and centers properly.

Why is this and how can I achieve this result not only in browsers, but in real app?

Image

Thanks, V

Victor Fagerström
Posts: 0
Joined: Sun Dec 01, 2013 1:03 pm

Centering content vertically works in browsers but not in Xcode simulator or Appery.io Tester

Thank you but that covers centering Horizontally: ---
I'm talking about centering Vertically: |||.

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

Centering content vertically works in browsers but not in Xcode simulator or Appery.io Tester

Hello! There is no guarantee app will work as expected on simulator...You would need to test it on real device.

Return to “Issues”