html - tag - CSS-Enlace no se puede hacer clic cuando se usa la posición absoluta

html structure template

Question

Aquí está el script HTML de mi encabezado:

<div class="header">
<div class="logo"><a href="Default.aspx"><img src="style/images/logo.png" alt="" /></a></div>
<div class="toplink"><a href="Signin.aspx">Sign in</a></div>
<div class="search">
    <form class="searchform" runat="server" method="get">
        <input type="text" id="s" name="s" value="Search for photos" onFocus="this.value=''''" onBlur="this.value=''Search for photos''"/>
    </form>
</div>
</div>

Y aquí está el script CSS:

.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;
}

De alguna manera, no se puede hacer clic en el enlace Iniciar sesión , pero cuando elimino la posición absoluta, funciona normalmente. ¿Hay alguna forma de hacer que el enlace funcione mientras se mantiene la posición? Cualquier sugerencia es apreciada, y gracias de antemano.

-Editar- Resulta que el problema está en otra parte. En realidad estoy usando la página maestra y creé una página ASP predeterminada usándola. El problema solo ocurre cuando pruebo esa página ASP, no el archivo HTML que utilicé para crear la página maestra. Lo siento si suene complicado pero sí, el problema es algo complicado para mí. Esperemos que alguien pueda señalar la razón para mí.

Answer 1

Intente agregar z-index:10; a .toplink{...} clase.