improve and fix style for safari

core/static/core/style.css

@@ -1,9 +1,16 @@
+html, body, div,
+h1, h2, h3, h4, h5, h6,
+a, p, b, i,
+form, label,
+table, thead, tbody, tr, td {
+    margin: 0;
+    border: none;
+    padding: 0;
+}
+
 html, body {
     width: 100%;
     height: 100%;
-    padding: 0;
-    margin: 0;
-    border: none;
     font-family: monospace;
     font-size: 14px;
 }
@@ -30,7 +37,6 @@ body {
 
 h1 {
     margin: 0 0 12px;
-    padding: 0;
     font-size: 1.3rem;
     font-weight: bold;
 }
@@ -40,7 +46,7 @@ p {
 }
 
 #title, #navi, #content {
-    flex: 0 1 0;
+    flex: 0 1 auto;
     width: 95%;
     max-width: 1200px;
     margin: 12px;
@@ -85,12 +91,6 @@ form p {
     color: #EE9966;
 }
 
-table, thead, tbody, tfoot, tr, td {
-    margin: 0;
-    border: none;
-    padding: 0;
-}
-
 table {
     border-collapse: collapse;
     margin: 16px 0;
@@ -154,59 +154,51 @@ td {
 
 #transaction-list {
     margin: 12px 0;
-    border: none;
-    padding: 0;
     display: flex;
     flex-direction: column;
 }
 
 .transaction-block {
-    flex: 0 1 0;
+    flex: 0 1 auto;
     max-width: 800px;
     margin: 0 0 8px;
     border-radius: 4px;
-    padding: 4px;
     display: flex;
     flex-direction: row;
-}
-
-.transaction-block-first {
-    flex: 1 0 0;
-    margin: 0 8px 0 0;
-}
-
-.transaction-block-second {
-    flex: 0 1 0;
-    margin: 0 0 0 8px;
-    align-items: end;
-}
-
-.transaction-block-first, .transaction-block-second {
-    border: none;
-    padding: 0;
-    display: flex;
-    flex-direction: column;
     justify-content: space-between;
 }
 
+.transaction-block-first, .transaction-block-second {
+    flex: 0 1 auto;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-evenly;
+}
+
+.transaction-block-first {
+    margin-right: 3%;
+    align-items: start;
+}
+
+.transaction-block-second {
+    align-items: end;
+}
+
 .date-block, .subject-block, .amount-block, .balance-block {
-    flex: 0 1 0;
-    padding: 3px;
+    flex: 0 1 auto;
+    margin: 3px;
+    padding: 3px 6px;
 }
 
 .date-block, .amount-block, .balance-block {
     white-space: nowrap;
 }
 
-.amount-block, .balance-block {
-    text-align: right;
-}
-
 .amount-block {
-    color: #BBBBBB;
+    margin-right: 6px;
     background-color: #222222;
     border-radius: 4px;
-    padding: 3px 6px;
+    color: #BBBBBB;
 }
 
 .balance-block {
@@ -220,12 +212,4 @@ td {
         flex-direction: row;
         align-items: center;
     }
-
-    .subject-block {
-        flex: 1 0 0;
-    }
-
-    .subject-block, .amount-block {
-        margin: 0 12px;
-    }
 }