bugfix für schmale Bildschirme: columns layout für die Fontliste

public/style.css

@@ -290,11 +290,10 @@ p {
   border: 1px solid #6600ea;
 }
 #font-selection ul {
-  display: flex;
-  flex-wrap: wrap;
-  flex-direction: row;
+  -moz-columns: 3 130pt;
+  columns: 3 130pt;
   margin: 0;
-  padding: 0.85rem;
+  padding: 0;
   border: 0;
   background: #efefef;
 }
@@ -302,6 +301,7 @@ p {
   min-width: 12em; /* due to longest word 'musical instruments'*/
   list-style: none;
   height: 20pt;
+  display: block;
 }
 #font-selection legend {
   width: auto;
@@ -405,6 +405,9 @@ p {
     margin: auto;
   }
   #font-selection ul {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: row;
     margin: 0 1rem;
     padding: 0.5rem;
     border-radius: 20px;
@@ -413,6 +416,11 @@ p {
   #font-selection li {
     min-width: 0;
   }
+  #font-selection legend {
+    text-align: center;
+    margin-left: auto;
+    margin-right: auto;
+  }
 }
 
 @media (prefers-color-scheme: dark) {