Fix background not staying behind the code when scrolling horizontally

This commit fixes a bug introduced in e2032e1 which changed the previous table layout to a pure CSS-based layout. Because the new layout used a "position: fixed" background, the background would not scroll when code lines were more wide than the browser window. This has been fixed by making the background "position: absolute" and moving it into the container DIV. Because the container DIV does not expand if its content is wider than the browser window though, I had to set the body background color to the same color than the code background and the container background to white, so that the left (comment) part stays white.
pycco-docs · Apr 5, 2012 · 459f92f · 459f92f
1 parent c0a6a23
commit 459f92f
Showing 1 changed file with 7 additions and 3 deletions.
diff --git a/pycco_resources/__init__.py b/pycco_resources/__init__.py
@@ -6,6 +6,7 @@
   line-height: 24px;
   color: #252519;
   margin: 0; padding: 0;
+  background: #f5f5ff;
 }
 a {
   color: #261a3b;
@@ -22,15 +23,18 @@
 h2, h3, h4, h5, h6 {
     margin-top: 0;
   }
+#container {
+  background: white;
+ }
 #container, div.section {
   position: relative;
 }
 #background {
-  position: fixed;
+  position: absolute;
   top: 0; left: 580px; right: 0; bottom: 0;
   background: #f5f5ff;
   border-left: 1px solid #e5e5ee;
-  z-index: -1;
+  z-index: 0;
 }
 #jump_to, #jump_page {
   background: white;
@@ -196,8 +200,8 @@
   <link rel="stylesheet" href="{{ stylesheet }}">
 </head>
 <body>
-<div id="background"></div>
 <div id='container'>
+  <div id="background"></div>
   {{#sources?}}
   <div id="jump_to">
     Jump To &hellip;