Tabla con CSS

[sergio87]

En este ejemplo que realizé, es una tabla totalmente con css. Pero lo que quiero lograr es que los "ul" se pinten cuando les haces hover por encima, asi como ya está hecho con fondo blanco pero que ocupe todo el "ul" no cada li por separado.

Cuando hago el hover de UL como que no queda bien! :O

http://www.sergioiglesias.com.ar/tabla.html

necesito vuestra ayuda. Gracias.

Sergio

[flpms]

Vos sabe que no esto no estas de acordo con la Web Semantica.
uno leitor de tela no vas pasar la informacion de la manera correcta

mas haga lo seguinte

Código CSS:

ul:hover{
background-color:#066;
}
 

[kalvinman]

o se eniende muy bien lo que escirbes pero en fin creo que el codigo va sin los dos puntos entre el ul y el hover. xD

[flpms]

yo estoy indicando algo com selectores CSS. Caso encontres outra solucion esta libre para hacer comentarios.

[flpms]

intentas utilizar las tablas mismos com las classes donde quiere que tenga efecto hover

Código HTML:

<table>
    <tr>
         <th>Diseño</th>
         <th>Programacíon</th>
         <th>Otros</th>
    </tr>
    <tr>
         <td>Adobe Photoshop</td>
         <td>Adobe Flex</td>
         <td>Manejo de PC</td>
    </tr>
    <tr>
         <td>Adobe Ilustrator</td>
         <td>Action Script</td>
         <td>Suite Office</td>
    </tr>
</table>
 

Código CSS:

Ahora CSS:
 
table{
 background-color:#FFFCE4;
}
 
table tr th:hover, table tr td:hover{
      background-color:#FFFFFF;
}
 
table tr:hover{
     background-color:#CCCCCC;
}
 

Este codigo és semanticamiente correcto. Solo tiene que hacer los cambios para tuya necesiudad

[sergio87]

Iniciado por flpms

Vos sabe que no esto no estas de acordo con la Web Semantica.
uno leitor de tela no vas pasar la informacion de la manera correcta

mas haga lo seguinte

Código CSS:

ul:hover{
background-color:#066;
}
 

No entendi que escribiste, pero el codigo que me pasaste no funciona. Aunque esta bien hecho, en este caso no funciona. Gracias.

Iniciado por kalvinman

o se eniende muy bien lo que escirbes pero en fin creo que el codigo va sin los dos puntos entre el ul y el hover. xD

Kalvinman, va con los dos puntos si queres hacer un hover. Saludos.

Iniciado por flpms

intentas utilizar las tablas mismos com las classes donde quiere que tenga efecto hover

Código HTML:

<table>
    <tr>
         <th>Diseño</th>
         <th>Programacíon</th>
         <th>Otros</th>
    </tr>
    <tr>
         <td>Adobe Photoshop</td>
         <td>Adobe Flex</td>
         <td>Manejo de PC</td>
    </tr>
    <tr>
         <td>Adobe Ilustrator</td>
         <td>Action Script</td>
         <td>Suite Office</td>
    </tr>
</table>
 

Código CSS:

Ahora CSS:
 
table{
 background-color:#FFFCE4;
}
 
table tr th:hover, table tr td:hover{
      background-color:#FFFFFF;
}
 
table tr:hover{
     background-color:#CCCCCC;
}
 

Este codigo és semanticamiente correcto. Solo tiene que hacer los cambios para tuya necesiudad

Ya en mi web la tengo hecha en tablas esa parte, por eso ahora quiero realizarlo con UL y con LI. Como te daras cuenta nada esta hecho en tablas.

Saludos.