replace table on overview page by divs

This works better in a responsive design.

1 files changed, 15 insertions, 12 deletions

diff --git a/layout/style.css b/layout/style.css
index 9bf4c7e..2df30cf 100644
--- a/layout/style.css
+++ b/layout/style.css
@@ -49,28 +49,31 @@ a:hover {
         text-decoration: underline;
 }
 
-table.summary th {
-        width: 300px;
-        font-weight: normal;
-        text-align: left;
+.row {
+        clear: left;
+        padding: 4px;
 }
 
-table.summary tr.even {
+.row.even {
 /*      background: #eeeeee; */
 }
 
-table.summary tr.odd {
+.row.odd {
 /*      background: #cccccc; */
 }
 
-table.summary td {
-        width: 50px;
-        text-align: right;
+.row label {
+        float: left;
+        width: 20em;
+}
+
+.row .field {
+        float: left;
+        width: 3.4em;
 }
 
-table.summary td.wide {
-        width: 125px;
-        text-align: right;
+.row .field.wide {
+        width: 8em;
 }
 
 img {