Fixed media queries.

CodeF0x · CodeF0x · commit f9dbbbd15e99 · 2019-07-31T11:43:19.000+02:00
diff --git a/src/css/main.css b/src/css/main.css
@@ -346,11 +346,9 @@ progress::-webkit-progress-value {
 
 #song-title,
 #song-artist {
-  float: left;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: 50%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
 }
 
 
@@ -402,11 +400,15 @@ input[type='range']::-webkit-slider-thumb {
 * and song title
 */
 @media (max-width: 1000px) {
-  #song-title {
-    max-width: 25%;
+  #song-title,
+  #song-artist {
+    max-width: 10em;
   }
+}
 
+@media (min-width: 1000px) {
+  #song-title,
   #song-artist {
-    max-width: 20%;
+    max-width: 28em;
   }
 }
diff --git a/src/index.html b/src/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta
       name="viewport"
-      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+      content="width=device-width, initial-scale=1"
     />
     <meta
       http-equiv="Content-Security-Policy"
