From b0afc86ad40f84ed3ae85a1c7074065f024d9634 Mon Sep 17 00:00:00 2001
From: Stefan Zermatten <stefanzermatten@gmail.com>
Date: Fri, 21 Jul 2023 16:12:50 +0200
Subject: [PATCH] "fixed" column layout again As yet untested on Safari

---
 .../client/ui/components/ColumnLayout.vue     | 29 +++++--------------
 .../printedCharacterSheet/PrintedStats.vue    |  1 -
 2 files changed, 7 insertions(+), 23 deletions(-)

diff --git a/app/imports/client/ui/components/ColumnLayout.vue b/app/imports/client/ui/components/ColumnLayout.vue
index 2d5341a5..69306c67 100644
--- a/app/imports/client/ui/components/ColumnLayout.vue
+++ b/app/imports/client/ui/components/ColumnLayout.vue
@@ -16,42 +16,27 @@ export default {
     wideColumns: Boolean,
   },
 };
-
-/*
-Removed to improve chrome layout performance, put it back if there are rendering errors
-.column-layout>span>div {
-  display: table;
-  table-layout: fixed;
-}
-*/
 </script>
 
 <style lang="css">
 .column-layout {
   column-count: 12;
   column-fill: balance;
-  column-gap: 0;
+  column-gap: 8px;
   column-width: 240px;
-  transform: translateZ(0);
-  padding: 4px;
+  padding: 8px;
 }
 
 .column-layout.wide-columns {
-  column-count: 12;
-  column-fill: balance;
-  column-gap: 0;
   column-width: 320px;
-  transform: translateZ(0);
-  padding: 4px;
 }
 
-.column-layout>div,
+.column-layout>*,
 .column-layout>span>div {
-  width: 100%;
-  backface-visibility: hidden;
-  transform: translateX(0);
-  page-break-inside: avoid;
+  display: inline-block;
   break-inside: avoid;
-  padding: 4px;
+  page-break-inside: avoid;
+  margin-bottom: 8px;
+  width: 100%;
 }
 </style>
diff --git a/app/imports/client/ui/creature/character/printedCharacterSheet/PrintedStats.vue b/app/imports/client/ui/creature/character/printedCharacterSheet/PrintedStats.vue
index 039209e2..f6e2ecf3 100644
--- a/app/imports/client/ui/creature/character/printedCharacterSheet/PrintedStats.vue
+++ b/app/imports/client/ui/creature/character/printedCharacterSheet/PrintedStats.vue
@@ -596,7 +596,6 @@ export default {
   margin-top: 4px;
   margin-left: -30px;
   padding-left: 34px;
-  z-index: -1;
 }
 
 .number-label .number {