no message

src/pages/grid/grid.html

@@ -1,9 +1,7 @@
 <ion-content no-padding>
-  <ion-grid no-padding>
+  <ion-grid>
     <ion-row align-items-stretch>
-      <ion-col col-4 *ngFor="let current of profiles" (tap)="profileTapped($event, current)">
-        <img [src]="current.details.pic.thumb">
-      </ion-col>
+      <ion-col col-4 *ngFor="let current of profiles" (tap)="profileTapped($event, current)" [style.backgroundImage]="getBackgroundThumbnail(current.details.pic)"></ion-col>
     </ion-row>
   </ion-grid>
 </ion-content>

src/pages/grid/grid.scss

@@ -1,7 +1,9 @@
 page-grid {
 
-  ion-col {
-    box-sizing: border-box;
+  .col {
+    background-size: cover;
     border: 1px solid #000000;
+    box-sizing: border-box;
+    padding: 0 0 33%;
   }
 }

src/pages/grid/grid.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
 import { NavController } from 'ionic-angular';
 
 import { ProfileService } from '../../services/profiles';
@@ -13,12 +14,16 @@ export class GridPage {
 
   profiles: any;
 
-  constructor(public navCtrl: NavController, public profileService: ProfileService) {
+  constructor(public navCtrl: NavController, public profileService: ProfileService, private _sanitizer: DomSanitizer) {
     profileService.load().then((data) => {
       this.profiles = data;
     });
   }
 
+  getBackgroundThumbnail(pics) {
+    return this._sanitizer.bypassSecurityTrustStyle('url(' + pics.thumb + ')');
+  }
+
   profileTapped(event, profile) {
     this.navCtrl.push(ProfilePage, {
       profile: profile