diff --git a/css/flippy.css b/css/flippy.css
index 6a8e3af..f4c3b57 100644
--- a/css/flippy.css
+++ b/css/flippy.css
@@ -72,8 +72,16 @@ flippy.fancy {
   height: 150px;
 }
 flippy.fancy img {
+  width:auto;
+  max-width:100%;
+  height:auto;
+  max-height:100%;
+  vertical-align: middle;
+}
+.cardHelper {
+  display: inline-block;
   height: 100%;
-  width: 100%;
+  vertical-align: middle; 
 }
 flippy.fancy flippy-front {
   float: none;
diff --git a/index.html b/index.html
index b7b98fc..27dd2a7 100644
--- a/index.html
+++ b/index.html
@@ -56,7 +56,7 @@
         </flippy-front>
 
         <flippy-back>
-            <img ng-src="img/cards/{{card.cardId}}.png" ng-show="card.cardType == 'picture'">
+            <span class="cardHelper"></span><img ng-src="img/cards/{{card.cardId}}.png" ng-show="card.cardType == 'picture'"></span>
             <div ng-hide="card.cardType == 'picture'">{{card.card['en-US']}}</div>
         </flippy-back>