topical media & game development

talk show tell print

basic-css-15-Exercises-exercise15-1-screen.css / css



  * {
      font-family: sans-serif;
      color: white;
  }
  body {
      margin: 0;     
  }
  h1, h2 {
      margin: 0;
      background: gray;
  }
  h1 {
      font-size: 1.6em;
      padding: 0.3em;
      border-bottom: 5px solid black;
      letter-spacing: -0.08em;
  }
  div {
      background: lightgrey;
      padding: 0.7em;
      clear: left;
  }
  h2 {
      font-size: 1em;
      padding: 0.2em;
  }
  ul#navigation {
      list-style: none;
      background: gray;
      margin: 0.1em;
      padding: 0;
  }
  ul#navigation li {
      float: left;
      margin: 0.4em;
  }
  ul#navigation li a {
      padding: 0.3em;
  }
  ul#navigation li a:link {
      background: gray;
  }
  ul#navigation li a:active {
      background: orange;
  }
  ul#navigation li a:visited {
      background: black;
  }
  ul#navigation li a:hover, li a:focus {
      background: white;
      color: black;
  }
  
  /* Dynamic link descriptions */
  
  ul#navigation div {
      position: absolute;
      right: 0;
      top: 0;
      background: gray;
      display: none; 
  }
  ul#navigation li:hover > div {
      display: block;
  }
  
  /* Watermark */
  
  div#watermark {
      position: fixed;
      bottom: 10px;
      right: 10px;
      font-size: 4em;
      padding: 0.1em;
      background: white;
      color: gray;
      opacity: 0.5;              
  }
  div#watermark a {
      color: black;
      text-decoration: none;
  }
  
  ul#top {
      color: black;
  }
  
  h3, p {
      color: black;
  }
  
  p {
      border: 0.05em solid black;
      padding: 0.8em;
  }
  h3:target {
      color: yellow;
      background: red;
  }
  
  ul#top li a {
      color: black;   
  }


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.