title: My HTML Buttons aren't working
body: <p>I have a Web page here that i am developing to further my knowledge in html/css/javascript and my buttons in my header don't seem to be working, the button:hover doesn't trigger at all and they don't redirect you to where there supposed to. Heres the code which I hop isn't to long and hard, but i put them in a comment tag which i hope will make it easier i have made it as easy as i can.
  They are near the middle. Any help will be appreciated:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;&lt;style&gt;
      html, body {
      height:100%;
  }
  body {
      overflow-y:hidden;
      overflow-x:hidden;
  }
  header{
      width: 98.907%;
      background: #000097;
      position: fixed;
      top: 0;
      height: 62px !important;
      opacity:.8;
      border-style: Outset;
      border-color: blue;
  }
  
  .content {
      position:relative;
      height: 100%;
      width:600px; /* Sizing - any length */
      padding:60px 0 30px 0; /* Header height and footer height */
      margin:0 auto 0 auto; /* Center content */
      -moz-box-sizing:border-box;
      -webkit-box-sizing:border-box;
      -o-box-sizing:border-box;
      -ms-box-sizing:border-box;
      box-sizing:border-box;
  }
  
  .sidebar1, .sidebar2 {
      background: #000047;
      top: -80px;
      bottom:-80px;
      width: 10px;
      position:absolute;
      -moz-box-sizing:border-box;
      -webkit-box-sizing:border-box;
      -o-box-sizing:border-box;
      -ms-box-sizing:border-box;
      box-sizing:border-box;
  }
  
  .search{
      background-repeat: no-repeat;
      background-color: #141414;
      height: 28px;
      width: 180px;
      font-size: 18px;
      color: #fbff00;
      border: 2px solid #fbff00;
      vertical-align:middle;
      padding: 2px 4px 0px 4px;
      margin: 0;
  }
  
  
  .sidebar1 {
  
    left: -342px;
  
  }
  
  .sidebar2 {
    right: -239px;
  }
  
  #scrollable2 {
    background:green;
    height: 99%;
    min-width: 1273px;
    margin-left: -332px;
    margin-right: 100px;
    /*position: absolute;*/
    top: 60px;
      overflow:auto;
      -moz-box-sizing:border-box;
      -webkit-box-sizing:border-box;
      -o-box-sizing:border-box;
      -ms-box-sizing:border-box;
      box-sizing:border-box;
  }
  
  .button {
      -moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
      -webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
      box-shadow:inset 0px 1px 0px 0px #f29c93;
      background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
      background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
      background-color:#fe1a00;
      width: 1272px;
      -moz-border-radius:6px;
      -webkit-border-radius:6px;
      border-radius:6px;
      border:1px solid #d83526;
      display:inline-block;
      color:#ffffff;
      font-family:arial;
      font-size:15px;
      font-weight:bold;
      padding:6px 24px;
      text-decoration:none;
      text-shadow:1px 1px 0px #b23e35;
  }.button:hover {
      background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
      background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
      background-color:#ce0100;
  }.button:active {
      position:relative;
      top:1px;
  }
  
  .button1 {
      -moz-box-shadow:inset 0px 1px 0px 0px #caefab;
      -webkit-box-shadow:inset 0px 1px 0px 0px #caefab;
      box-shadow:inset 0px 1px 0px 0px #caefab;
      background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #77d42a), color-stop(1, #5cb811) );
      background:-moz-linear-gradient( center top, #77d42a 5%, #5cb811 100% );
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77d42a', endColorstr='#5cb811');
      background-color:#77d42a;
      -moz-border-radius:6px;
      -webkit-border-radius:6px;
      border-radius:6px;
      border:1px solid #268a16;
      display:inline-block;
      white-space:nowrap;
      color:#306108;
      font-family:arial;
      font-size:15px;
      font-weight:bold;
      padding:6px 24px;
      text-decoration:none;
      text-shadow:1px 1px 0px #aade7c;
  }.button1:hover {
      background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #5cb811), color-stop(1, #77d42a) );
      background:-moz-linear-gradient( center top, #5cb811 5%, #77d42a 100% );
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cb811', endColorstr='#77d42a');
      background-color:#5cb811;
  }.button1:active {
      position:relative;
      top:1px;
  }
  
  footer {
      width: 100%;
      background: #000047;
      position: fixed;
      bottom: 0;
      height: 30px;
  }
  .p {
      text-align: center;
      color: #bcbcbc;
      font-size: x-large;
      white-space:nowrap;
  }
      &lt;/style&gt;
      &lt;script&gt;
  
      &lt;/script&gt;
      &lt;title&gt;Davids LAN Website&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;header&gt;
              &lt;table width="100%"&gt;
              &lt;tr&gt;
              &lt;td&gt;&amp;nbsp;&lt;/td&gt;&lt;/tr&gt;
                  &lt;tr&gt;
                      &lt;!-----
                      The Problem is here or mabye in the styling but for some reason my skin viewer page and chat page don't work, the hover style and the link opening
  
  
  
  
  
                      &lt;td&gt;&lt;a href="plugins.html"&gt;&lt;button class="button1"&gt;Plugins&lt;/button&gt;&lt;/a&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;a href="upload.php"&gt;&lt;button class="button1"&gt;Upload&lt;/button&gt;&lt;/a&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;p class="p"&gt;Davids LAN Site&lt;/p&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;a href="skinviewer.html"&gt;&lt;button class="button1"&gt;Skin Viewer&lt;/button&gt;&lt;/a&gt;&lt;/td&gt;
                      &lt;td&gt;&lt;a href="chat.php"&gt;&lt;button class="button1"&gt;Chat&lt;/button&gt;&lt;/a&gt;&lt;/td&gt;
  
  
  
  
                      -----&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                      &lt;td&gt;&amp;nbsp;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;/table&gt;
          &lt;/header&gt;
          &lt;!-- Fixed size after header--&gt;
          &lt;div class="content"&gt;
          &lt;div class="sidebar1"&gt;
  
          &lt;/div&gt;
              &lt;!-- Always on top. Fixed position, fixed width, relative to content width--&gt;
              &lt;!-- Scrollable div with main content --&gt;
              &lt;div id="scrollable2"&gt;
              &lt;a href="http://dl.bukkit.org/downloads/craftbukkit/get/01479_1.3.2-R3.0/craftbukkit.jar" target="_blank"&gt;
                  &lt;button class="button"&gt;&lt;img src="https://twimg0-a.akamaihd.net/profile_images/1205959797/bukkit_normal.png"/&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;Download Craftbukkit&lt;/button&gt;&lt;/a&gt;
              &lt;p class="p"&gt;How to set up Bukkit Server&lt;/p&gt;
              &lt;center&gt;&lt;video width="800" controls="controls"&gt;
                  &lt;source src="movies/bukkit.mp4" type="video/mp4"&gt;
                  &lt;source src="movies/bukkit.ogg" type="video/ogg"&gt;
                  Your browser does not support the video tag.
                  &lt;/video&gt;&lt;video width="800" controls="controls"&gt;
                  &lt;source src="movies/regular.mp4" type="video/mp4"&gt;
                  &lt;source src="movies/regular.ogg" type="video/ogg"&gt;
                  Your browser does not support the video tag.
                  &lt;/video&gt;&lt;/center&gt;
                  &amp;nbsp;
                  &lt;a href="http://www.youtube.com/watch?v=VJD6E8J5Ioc&amp;feature=plcp" target="_blank"&gt;
                  &lt;button class="button"&gt;If you have Firefox please click here to view the youtube videos
                  &lt;/button&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
              &lt;!-- Always on top. Fixed position, fixed width, relative to content width --&gt;
          &lt;/div&gt;
          &lt;!-- Always at the end of the page --&gt;
          &lt;footer&gt;
  
          &lt;/footer&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>