Made top bars and bottom bars float on top always.

tompreston · Jan 22, 2012 · 84efd0b · 84efd0b
1 parent 444010e
commit 84efd0b
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 12 deletions.
diff --git a/css/style.css b/css/style.css
@@ -38,7 +38,7 @@
   background: url("../images/next.png") no-repeat 0 0;
 }
 
-#buttonWrapper
+.buttonWrapper
 {
   /*position: absolute;
   top: 385px;*/
@@ -114,3 +114,21 @@
 {
 	background-image: url('../images/SpeakerIcon.png');
 }
+
+#bottombar {
+	position:fixed;
+	bottom:0px;
+	z-index: 1;
+}
+
+#topbar {
+	position:fixed;
+	top:0px;
+	width:100%;
+	z-index: 1;
+
+}
+#content {
+	padding-top:44px;
+	padding-bottom:48px;
+
diff --git a/index.php b/index.php
@@ -89,19 +89,19 @@
 						<span class="arrow"></span>
 					</a>
 				</li>
-			</ul>
-
-			<div id="buttonWrapper">
-				<div id="buttonHolder">
-					<span id="previousButton"></span>
-					<span id="playPauseButton" class="play"></span>
-					<span id="nextButton"></span>
-				</div>
-				<div id="buttonBackgroundFiller"></div>
-			</div>
-
+			</ul>	
 		</div> <!-- inner content; don't display if we can't connect to mpd -->
 	</div>
+
+	<div id="bottombar" class="buttonWrapper">
+		<div id="buttonHolder">
+			<span id="previousButton"></span>
+			<span id="playPauseButton" class="play"></span>
+			<span id="nextButton"></span>
+		</div>
+		<div id="buttonBackgroundFiller"></div>
+	</div>
+
 
 	<div id="footer">
 		<a class="noeffect" href="http://iwebkit.net">Thanks to iWebKit for all the style sheets.</a>