gistfile1.diff

diff --git a/apps/music/js/music.js b/apps/music/js/music.js
index 2f1923a..c55eea5 100644
--- a/apps/music/js/music.js
+++ b/apps/music/js/music.js
@@ -307,7 +307,6 @@ var MODE_SUBLIST = 3;
 var MODE_PLAYER = 4;
 var MODE_SEARCH_FROM_TILES = 5;
 var MODE_SEARCH_FROM_LIST = 6;
-var UI_SIZE_SEGMENTS = window.innerWidth / 3;
 
 var ModeManager = {
   _modeStack: [],
@@ -592,12 +591,10 @@ var TilesView = {
     // and the first tile is the main-tile
     // so we mod 6 to find out who is the main-tile
     if (this.index % 6 === 0) {
-      tile.style.height = UI_SIZE_SEGMENTS * 2+"px";
       tile.classList.add('main-tile');
       artistName.classList.add('main-tile-title');
       titleBar.appendChild(albumName);
     } else {
-      tile.style.height = UI_SIZE_SEGMENTS+"px";
       tile.classList.add('sub-tile');
       artistName.classList.add('sub-tile-title');
     }
diff --git a/apps/music/style/music.css b/apps/music/style/music.css
index 1a71fa3..3c29e01 100644
--- a/apps/music/style/music.css
+++ b/apps/music/style/music.css
@@ -404,23 +404,27 @@ body.player-mode #title-player {
 
 .tile {
   -moz-box-sizing: border-box;
+  position: relative;
   background-position: center;
   background-size: cover;
+
   /* We set a background URL here when the thumbnail loads */
 }
 
 .main-tile {
-  width: calc((100% / 3) * 2);
-  /* Height  defined in music.js UI_SIZE_SEGMENTS */
-  border: 0.1rem solid rgba(0, 0, 0, 1);
+  width: 66.6%;
+  height: 0;
+  padding-bottom: calc(66.6% - 0.201rem); /* add 0.001 to workaround the problem of float rounding */
+  border: 0.1rem solid black;
   background-color: black;
   overflow: hidden;
 }
 
 .sub-tile {
-  width: calc(100% / 3);
-  /* Height  defined in music.js UI_SIZE_SEGMENTS */
-  border: 0.1rem solid rgba(0, 0, 0, 1);
+  width: 33.3%;
+  height: 0;
+  padding-bottom: calc(33.3% - 0.2rem);
+  border: 0.1rem solid black;
   font-weight: lighter;
   background-color: #303030;
   overflow: hidden;
@@ -432,8 +436,11 @@ body.player-mode #title-player {
 }
 
 .tile-container {
-  width: 100%;
-  height: 100%;
+  position: relative;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
   opacity: 1;
   background-color: rgba(0 ,0, 0, 0);
   transition: background-color 166ms ease-in-out;
@@ -492,6 +499,7 @@ body.player-mode #title-player {
 .float-right {
   position: relative;
   float: right;
+  right: 0.1%;
 }
 
 .default-album-0 {