Trayendo lista por jQuery y aplicandole hipervínculos a los elementos de esta.

[alberto510a]

Hola a todos.

Estoy realizando una web de inglés y en una parte de gramática monte una especie de módulo de jQuery que al pulsar en los diferentes elementos de un índice carga una lista u otra.

(El código esta hecho por mi entero)

Bien hasta aquí creo. Bueno mi problema viene cuando pulso en el enlace Tiempos del índice y me carga la lista de estos. Al pasar el ratón por los hipervínculos de la lista de Tiempos no me los detecta algunos y otros me detecta como enlace solo media palabra.
No sé porque ocurre esto. Probé a cambiar la forma de los hipervínculos (display:block) y cambiar los enlaces de capas (z-index) pero no consigo arreglarlo.

Aquí la página:

http://www.coolenglish.tk/gr/grammar.php

Tienen que pulsar donde pone tiempos y verán lo que les cuento.

Nota: Tienen puesto hipervículos los elementos de la lista que estan en negro total y no gris.

Gracias.

[diurno10]

Lo primero que debes de modificar ,es el armado de la lista, es decir un <a> no debe contener a un <li>, y en cuanto a los que no tienen links no se como armas la lista , pareceria q estas haciendo alguna validacion del lado del servidor ya q tu html aparece asi.

<ul style="float:left; position:relative;left:30px;">
<a id="pasts"><li>Past Simple</li></a>
<a id="pastc"><li>Past Continuous</li></a>
<a id="pastps"><li>Past Perfect Simple</li></a>
<li>Past Perfect Continuous</li> --> xq este no lleva links???
</ul>

si queres poner tu codigo php que arma la lista y lo vemos.

[alberto510a]

La lista no la traigo por php fijate en el código del archivo funciones.js ahí viene lo que hice para traerla.

Ese no tiene link porque no estaba terminado me había parado al ver este problema.

Cambie los hipervínculos de fuera de los <li></li> a dentro y sigue =.

¿Se te ocurre algo más?

[alberto510a]

Me di cuenta que es del 3º <ul> que ocupa más ancho del que debería pero le reduzco y se me desequilibra todo ¿sabes porque puede ser?

[diurno10]

ya esta!! era el position:relative.
es decir a los <ul> sacale los estilos que tiene y ponele esto:
float: left;
margin-left: 30px;

a los tres <ul> ponele lo mismo y listo.

[alberto510a]

Pues sí, así si funciona. Pero es extraño la 3º lista chrome me la sigue marcando como que ocupa 580px y si le cambio el tamaño se me desorganiza todo : /

Bueno gracias por ayudarme.