update basic css to work on older kindles

carderne · Apr 4, 2024 · a48a047 · a48a047
1 parent ec8afde
commit a48a047
Showing 1 changed file with 35 additions and 12 deletions.
diff --git a/cps/templates/basic_layout.html b/cps/templates/basic_layout.html
@@ -11,11 +11,31 @@
 }
 
 nav {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  background-color: #f8f8f8;
   height: 50px;
+  padding: 5px 20px;
+  width: 100%;
+  display: table;
+  box-sizing: border-box;
+  border-bottom: 1px solid black;
+}
+
+nav > * {
+  display: inline-block;
+  display: table-cell;
+  vertical-align: middle;
+  float: none;
+  text-align: center;
+  width: auto;
+}
+
+nav > *:first-child {
+  text-align: left;
+  width: 1%;
+}
+
+nav > *:last-child {
+  text-align: right;
+  width: 1%;
 }
 
 nav > a {
@@ -25,13 +45,10 @@
 
 .search {
   margin: auto auto;
-  width: 50%;
-  display: flex;
-  flex: 1;
-  justify-content: center;
 }
 
 form > input {
+  width: 18ch;
   padding-left: 4px;
 }
 
@@ -52,15 +69,15 @@
 
 button {
   border: none;
-  padding: 0;
+  padding: 0 10px;
   margin: 0;
   width: 80px;
   height: 100%;
   background-color: white;
 }
 
 .body {
-  padding: 0 20px;
+  padding: 5px 20px;
 }
 
 a {
@@ -81,11 +98,17 @@
 }
 
 .pagination {
-  display: flex;
-  justify-content: space-between;
   padding: 10px 0;
   height: 20px;
 }
+
+.pagination > div {
+  float: left;
+}
+
+.pagination > div:last-child {
+  float: right;
+}
 </style>
 </head>