I'm developing an android app, but I'm programming in eclipse on windows using HTML , JavaScript , CSS and JQuery
To test application development I was using an extension for google chrome and sometimes also used the Chrome DevTools Overview (F12) mobile version.
The problem is that in these two places where testing, the main menu of the application was well centered, both vertically and horizontally. At this point, I started testing even on an iOS device and the menu appears to me nothing centered.
I was using this CSS that worked in chrome, but not in the iOS device:
.center{
/** CENTRAR NO ECRA * */
margin: 0;
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 50%;
text-align: center;
}
HTML
<div class="center">
<img id="imgLogoLogin" src="img.png" alt="LOGO"
class="imgLogoCenter" width="250px" />
<h1>Welcome</h1>
Any suggestions?
Q. I have no experience with IOS