title: CSS - Link not clickable when using absolute position
body: <p>Here is the HTML script of my header: </p>
  
  <pre><code>&lt;div class="header"&gt;
  &lt;div class="logo"&gt;&lt;a href="Default.aspx"&gt;&lt;img src="style/images/logo.png" alt="" /&gt;&lt;/a&gt;&lt;/div&gt;
  &lt;div class="toplink"&gt;&lt;a href="Signin.aspx"&gt;Sign in&lt;/a&gt;&lt;/div&gt;
  &lt;div class="search"&gt;
      &lt;form class="searchform" runat="server" method="get"&gt;
          &lt;input type="text" id="s" name="s" value="Search for photos" onFocus="this.value=''" onBlur="this.value='Search for photos'"/&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And here is the CSS script:</p>
  
  <pre><code>.logo {
      padding: 30px 0;
  }
  
  .logo img {
      display: inline;
  } 
  
  .toplink {
      position: absolute;
      bottom: 40px;
      right: 280px;
      font-size: 14px;
  }
  
  .search {
      position: absolute;
      bottom: 10px;
      right: 0;
      font-size: 14px;
      width: 330px;
  }
  </code></pre>
  
  <p>Somehow the <strong>Sign in</strong> link isn't clickable, but when I remove the absolute position, it works normally. Is there anyway to make the link work while still keeping the position? Any suggestion is appreciated, and thanks in advance.</p>
  
  <p>-Edit-
  Turns out the problem lies somewhere else. Actually I'm using masterpage and I created a default ASP page using it. The problem only occurs when I test that ASP page, not the HTML file that I used to create the masterpage. Sorry if I sound complicated but yeah, the problem's sort of complicated to me. Hopefully someone can point out the reason for me.</p>