Record sheet layout

public/assets/css/style.css

@@ -281,12 +281,16 @@ div#content {
 }
 
 #record-sheet {
-  /* max-height: 100%; */
-  overflow-y: auto;
   display: flex;
+  min-height: 0;
   flex-direction: column;
-  /* display: none; */
   background-color: gray;
+  flex-grow: 1;
+}
+
+
+#record-sheet .records {
+  overflow-y: auto;
 }
 
 #record-sheet .name {
@@ -294,9 +298,10 @@ div#content {
 }
 
 #record-sheet > div {
-  /* padding: 0 2px; */
-  overflow-y: auto;
-  /* border: 1px solid black; */
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
 }
 
 #record-sheet > div > p {
@@ -308,54 +313,39 @@ div#content {
 }
 
 #record-sheet .soldier-record {
-  /* border: 1px solid black; */
   margin-bottom: 1px;
   padding: 6px 4px;
-  /* border-radius: 4px; */
 }
 
 #record-sheet > div:last-of-type {
-  margin-top: 2px;
+  margin-top: 1px;
 }
 
-#record-sheet > div > div:last-of-type {
+#record-sheet .records > div:last-of-type {
   margin-bottom: 0;
 }
 
 
 
-/* @media (width >= 1800px) { */
-@media (width >= 10px) {
+@media (width >= 1800px) {
   #record-sheet {
     flex-direction: row;
-    /* gap: 2px; */
     overflow-y: unset;
     min-height: 0;
     flex-grow: 1;
-    /* height: 100%;
-    max-height: 100%; */
-  }
-
-  #record-sheet * {
-    /* display: none; */
   }
 
   #record-sheet > div > p {
     margin-top: 0;
+    white-space: nowrap;
   }
 
   #record-sheet > div {
-    /* max-height: unset; */
-    /* overflow-y: unset; */
-    /* height: min-content; */
     display: flex;
     flex-direction: column;
   }
 
   #record-sheet .records {
-    /* max-height: 100vh; */
-    /* height: 561px; */
-    /* height: min-content; */
     overflow-y: auto;
   }
 
@@ -364,12 +354,10 @@ div#content {
   }
 
   #record-sheet > div:first-of-type > div {
-    /* margin-left: 1px; */
     margin-right: 1px;
   }
 
   #record-sheet > div:last-of-type > div {
     margin-left: 1px;
-    /* margin-right: 1px; */
   }
 }