Responsive App design


Hey Guys,

First time creating a Ionic app and I’m loving it so far!
I see great potentials with this framework and can’t wait for the full stack version of it.

I’m creating my first native iOS app using, generator-ionic with Firebase as the database and I have some Responsive questions.

How should I code for the different screen sizes that iOS has?
Certain images look way bigger on a 2x Retina screen etc. I’m trying to center the image on the log in screen but on every device it seems to be different


<ion-view hide-nav-bar="true" class="homelogin">  
<div id="landingBox">
	<img src="img/logoLanding.png">  
		<a class="facebookLink" ng-click="tryLogin()">Login with Facebook</a>


.#landingBox {

.#landingBox img{

Appreciate the support,



You probably need to explore media queries for styling across a range of devices.

WARNING: I hate CSS and suck at it. I’m not sure I’m doing media queries well.

Example :

@media (min-width: 321px) {

    #landingBox {
        max-width: 50%

@media (max-width: 320px) {
    #landingBox {
        max-width: 30%