clean up CSS, and add blue border.
[invirt/packages/invirt-web.git] / code / static / layout.css
index e5cc071..459cc9f 100644 (file)
@@ -1,3 +1,39 @@
-html,body {
-       height: 100%;
+/*
+  Good layout ideas stolen from Debathena.
+  Hey, we use some different fonts (in style.css.)
+  And the background color is unmistakably different.
+  Some other things are tweaked too.
+*/
+
+/* This file contains screen-only layout declarations that won't be
+   used for printing. */
+
+/* Make <body /> show up as a centered white box with rounded border,
+   over the darker enclosing <html />. */
+html {
+    padding: .75em;
+    background: #09c;
+}
+body {
+    position: relative;
+    margin: 0 auto;
+    padding: 1.2em;
+    border: 1px solid black;
+    -moz-border-radius: .4em;
+    -webkit-border-radius: .4em;
+    border-radius: .4em;
+    background: #fff;
+}
+
+/* Limit the <body /> width for readability. */
+body {
+    max-width: 60em;
+}
+
+/* Increase line heights for better screen readability. */
+p, li, dt, dd, address {
+    line-height: 1.5em;
+}
+pre {
+    line-height: 1.25em;
 }