From df4a403473e9e1bf99ba0c207f205b0b2690cf7f Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Sun, 22 Dec 2019 08:51:08 -0500
Subject: [PATCH] Make use of css flex in matrix UI

---
 src/css/popup.css | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/css/popup.css b/src/css/popup.css
index 9d3def9..62edd2f 100644
--- a/src/css/popup.css
+++ b/src/css/popup.css
@@ -347,19 +347,19 @@ body.tabless .needtab {
     text-align: left;
     }
 .matRow {
+    align-items: flex-start;
     display: flex;
-    white-space: nowrap;
     }
 .matCell {
+    box-sizing: content-box;
+    display: inline-flex;
+    flex-shrink: 0;
+    justify-content: center;
+    line-height: 110%;
     margin: 1px 1px 0 0;
     padding: 6px 2px;
-    display: inline-block;
-    box-sizing: content-box;
-    width: 2.6em;
-    white-space: nowrap;
-    text-align: center;
-    line-height: 110%;
     position: relative;
+    width: 2.6em;
     }
 
 #matHead {
@@ -380,7 +380,9 @@ body.tabless .needtab {
 /* RFC 3987 Internationalized Resource Identifiers (IRIs) -- 4.4 */
 .matrix .matRow > .matCell:first-child {
     direction: ltr;
-    text-align: right;
+    flex-grow: 1;
+    flex-shrink: 1;
+    justify-content: flex-end;
     unicode-bidi: embed;
     width: 16em;
     }