Permalink
Browse files

Demo 2: apply shading to nested divs.

  • Loading branch information...
1 parent a5adc3b commit c4fc6355a0f9204b210e53459bcb682ebfe32195 @nelstrom committed Nov 24, 2010
Showing with 62 additions and 0 deletions.
  1. +37 −0 public/demo_2/index.html
  2. +25 −0 public/demo_2/styles.css
View
37 public/demo_2/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Golden Compass</title>
+ <link rel="stylesheet" href="styles.css" type="text/css" media="screen"/>
+</head>
+<body>
+ <div id="container">
+ <div class="cycle">
+ <div>
+ <div>
+ <div>
+ <div class="cycle">
+ <div>
+ <div>
+ <div>
+ <div class="cycle">
+ <div>
+ <div>
+ <div>
+ <div class="cycle"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</body>
+</html>
+
View
25 public/demo_2/styles.css
@@ -0,0 +1,25 @@
+html, body {
+ height: 100%; width: 100%;
+ margin: 0; padding: 0;
+}
+
+#container > div {
+ margin: 0 auto;
+ width: 485.4px;
+ height: 300px;
+}
+
+.cycle,
+.cycle > div > div {
+ height: 38.2%;
+ width: 100%;
+}
+.cycle > div,
+.cycle > div > div > div {
+ width: 38.2%;
+ height: 100%;
+}
+
+#container div {
+ background-color: rgba(0,0,0,0.07)
+}

0 comments on commit c4fc635

Please sign in to comment.