Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Utilicas CSS en jerarquias en tablas

Estas en el tema de Utilicas CSS en jerarquias en tablas en el foro de CSS en Foros del Web. Hola que tal tengo 2 hojas de estilo en la cual intento dividir menús y tablas a las cuales les voy a aplicar CSS <link ...
  #1 (permalink)  
Antiguo 27/11/2013, 16:00
Avatar de emilio_viguri  
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Pregunta Utilicas CSS en jerarquias en tablas

Hola que tal tengo 2 hojas de estilo en la cual intento dividir menús y tablas a las cuales les voy a aplicar CSS

<link rel="stylesheet" type="text/css" href="archivos/css/menu.css">
<link rel="stylesheet" type="text/css" href="archivos/css/tablas.css">

Los menús funcionan bien, ya que lo aplico a mi página y todo bien, mi problema esta al momento que intento unir los dos estilos CSS a tablas, pero si lo pongo solo ya sea menú o tablas por separado lo hace bien, a lo que intento es que por ejemplo, si yo quiero poner estilo a determinadas tablas pues que yo le ponga un ID un div o class o algo que identifique que solo el estilo tablas se le va aplicar el estilo y no lo aplique a todo el sitio.

el de menú seria <!--CSS para MENU-->, y al que solo le quiero aplicar el estilo tablas seria el siguiente código al final pongo mi hoja de estilo de tablas.

esto funciona bien con mi hoja menu.css
Código PHP:
[HIGHLIGHT="HTML"]
     <!--
CSS para MENU-->     
     <
div id="menupri">
 <
ul>
  <
li><a href="#"><img src="archivos/imagenes/iconos/paper1.gif" height="16" border="0" align="absmiddle"Capturar Ingresos</a></li>
  <
li><a href="#"><img src="archivos/imagenes/iconos/capgasto.gif" height="19" border="0" align="absmiddle" /> Capturar Egresos</a></li>
  <
li class="MPencabezado">Control y Analisis Clientes&amp;Proveedor</li>
  </
ul>
</
div><br />
    <!--
MENU FIN-->
[/
HIGHLIGHT
Bueno mi pagina esta echa de tablas, a lo que solo quiero poner el estilo a STable
o a lo que yo le ponga class="STable" esto decoraría las tablas y si pasas el ratos te cambia de color las tablas y otras cosas que estan en el CSS, esto si funciona solo pero ya con mis 2 hojas juntas no ... me ayudan ?

Código HTML:
Ver original
  1. <table width="100%" border="0" cellspacing="0" cellpadding="0">
  2.        <tr>
  3.         <td align="center"><p>INFORMACION</p>
  4.  
  5.  
  6.           <table border="0" cellpadding="0" cellspacing="0" class="STable">
  7.           <caption class="encabezado">HOLA como estas Tu</caption>
  8.             <tr>
  9.               <td class="fresalta">fresalta</td>
  10.               <td class="encabezado">encabezado</td>
  11.               <td class="STtable">3</td>
  12.               <td>4</td>
  13.               <td>5</td>
  14.             </tr>
  15.             <tr>
  16.               <td class="odd">6</td>
  17.               <td class="odd">odd</td>
  18.               <td class="encabezado">8</td>
  19.               <td>9</td>
  20.               <td>1</td>
  21.             </tr>
  22.             <tr>
  23.               <td>654</td>
  24.               <td class="fporpagar"><p>fporpagar</p></td>
  25.               <td>65</td>
  26.               <td>4</td>
  27.               <td><a href="#" class="ligas">Link</a></td>
  28.             </tr>
  29.             <tr>
  30.               <td>654</td>
  31.               <td>654</td>
  32.               <td>65</td>
  33.               <td class="marca">Marca</td>
  34.               <td>54</td>
  35.             </tr>
  36.           </table>
  37.          
  38.           <p>&nbsp;</p></td>
  39.        </tr>
  40.       </table>

mi hoja de estilo tablas a la que quiero aplicar solo se le pongo STable
Código CSS:
Ver original
  1. @charset "utf-8";
  2. /* CSS Document */
  3.  
  4. .STable {
  5.     border-collapse: collapse;
  6.     border: 1px solid #03476F;
  7.     font: normal 11px verdana, arial, helvetica, sans-serif;
  8.     color: #363636;
  9.     background-color: #CCFFCC;
  10. }
  11. .STable .fporpagar {
  12.     background-color:#AAFFAA;
  13.     color: #006600;
  14. }
  15. .STable .fresalta  {
  16.     color: #FF0000;
  17.     font-weight: bold;
  18. }
  19. .STable .odd {
  20.     background-color: #CCFFFF;
  21.   }
  22. .STable .encabezado {
  23.     background-color: #0099CC;
  24.     color: #FFFFFF;
  25.   }
  26. .STable .marca{
  27.     background-color:#FFE4CA;
  28.     color: #009900;
  29.   }
  30. .STtable .ligas {
  31.     font-family: Verdana, Arial, Helvetica, sans-serif;
  32.     color: #0000FF;
  33.     background-color: #FF0;
  34.     }
  35.  
  36.  
  37. .STable caption {
  38.   text-align: center;
  39.   font: bold 18px arial, helvetica, sans-serif;
  40.   background: transparent;
  41.   padding:6px 4px 8px 0px;
  42.   color: #03476F;
  43.   text-transform: uppercase;
  44.   }
  45.  
  46. .STable td, th {
  47.     border: 1px dotted #03476F;
  48.     padding: .4em;
  49.     vertical-align: bottom;
  50.   }
  51.  
  52.  
  53.  
  54.  
  55.  
  56. .STtable thead th, tfoot th {
  57.     font: bold 11px verdana, arial, helvetica, sans-serif;
  58.     border: 1px solid #03476F;
  59.     color: #FFFFFF;
  60.     padding-top:3px;
  61.     background-color: #99CCFF;
  62.   }
  63. .STtable tbody td a {
  64.   background: transparent;
  65.   text-decoration: none;
  66.   color: #363636;
  67.   }
  68. .STtable tbody td a:hover {
  69.     color: #363636;
  70.     background-color: #FFFFFF;
  71.   }
  72.   .STtable tbody th a {
  73.     background: transparent;
  74.     text-decoration: none;
  75.     font-weight:bold;
  76.     color: #FFFFFF;
  77.     font-family: verdana, arial, helvetica, sans-serif;
  78.     font-size: 11px;
  79.     font-style: normal;
  80.     font-variant: normal;
  81.   }
  82. .STtable tbody th a:hover {
  83.   background: transparent;
  84.   color: #FFFFFF;
  85.   }
  86. .STtable tbody th, tbody td {
  87.   vertical-align: top;
  88.   }
  89. .STtable tfoot td {
  90.     border: 1px solid #03476F;
  91.     padding-top:3px;
  92.     color: #FFFFFF;
  93.     background-color: #0099CC;
  94.   }
  95. .STtable tbody tr:hover {
  96.     border: 1px solid #03476F;
  97.     color: #FFFFFF;
  98.     background-color: #C6E2FF;
  99.   }
  100. .STtable tbody tr:hover th,
  101. .STtable tbody tr.odd:hover th {
  102.     color: #FFFFFF;
  103.     background-color: #009900;
  104.   }
  #2 (permalink)  
Antiguo 27/11/2013, 18:16
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 3 meses
Puntos: 306
Respuesta: Utilicas CSS en jerarquias en tablas

Si tienes un link para ver cuales se superponen o mejor dicho cuales prevalecen.

Además te dejo algo sobre el tema, que es la especificidad (o como se diga):
http://ksesocss.blogspot.com/2012/05...ficidad-y.html

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 28/11/2013, 10:23
Avatar de emilio_viguri  
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Sonrisa Respuesta: Utilicas CSS en jerarquias en tablas

C2am antes que canda Gracias por tu tiempo...

Mira ya puse lo que me pides para ver si me puedes ayudar a solucionarlo...

Se supone que la tabla también hace lo que el menú de la izquierda pero con tablas pero combinado no mas no lo hace pero por archivos separados si lo hace...

Es como si pusiera 2 menús uno con LI y otro con tablas como la pagina que me mandaste estoy che cando


Hola que tal mira pongo los archivos para descarga aquí esperando me puedan ayudar
https://www.dropbox.com/s/y49zi4yar5xjchy/ForosWEB.rar

Aquí lo pueden ver en funcionamiento...

http://attitude-marketing.com/evm/

Última edición por emilio_viguri; 28/11/2013 a las 10:27 Razón: + Detalles
  #4 (permalink)  
Antiguo 28/11/2013, 12:04
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 3 meses
Puntos: 306
Respuesta: Utilicas CSS en jerarquias en tablas

A que te refieres con que "hace lo que el menú"? Es el color naranja al hacer :hover?
No veo fallo, ya que los estilos que se corresponden con la tabla son los que aparecen
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #5 (permalink)  
Antiguo 28/11/2013, 12:44
Avatar de emilio_viguri  
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Pregunta Respuesta: Utilicas CSS en jerarquias en tablas

Lo que pasa es que las tablas también tiene HOBER sobre ellan entonces cuando pasas el raton sobre esa tabla, también debería hacer el iluminado similar al menú de la izquierda, bueno pero con la diferencia de que tiene otros colores...

E incluso tengo dos opciones que me las pone como flotando en la parte superior cuando no debería de estar hay esas me las afecta cuando no les puse ningún atributo entonces por lo que vi mi cascada CSS esta mal, pero a un no entiendo por que

Última edición por emilio_viguri; 28/11/2013 a las 12:50
  #6 (permalink)  
Antiguo 28/11/2013, 21:28
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 15 años, 3 meses
Puntos: 306
Respuesta: Utilicas CSS en jerarquias en tablas

El problema (a parte del hecho de que maquetas con tablas, cuando las tablas son sólo para datos tabulados), es que la clase que declaras en el html es STable, pero en el css tienes la clase STtable

NO MAQUETES CON TABLAS.
Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #7 (permalink)  
Antiguo 29/11/2013, 09:52
Avatar de emilio_viguri  
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Sonrisa Respuesta: Utilicas CSS en jerarquias en tablas

Cita:
Iniciado por C2am Ver Mensaje
El problema (a parte del hecho de que maquetas con tablas, cuando las tablas son sólo para datos tabulados), es que la clase que declaras en el html es STable, pero en el css tienes la clase STtable

NO MAQUETES CON TABLAS.
Saludos
Perdón no se de que me hablas ...
Que puedo hacer entonces ...

como tengo mis estilo y de mas pues lo que se me ocurría es ponerle la clases a lo que quería usar STable
  #8 (permalink)  
Antiguo 29/11/2013, 09:56
Avatar de jonni09lo
Colaborador
 
Fecha de Ingreso: septiembre-2011
Ubicación: Estigia
Mensajes: 1.471
Antigüedad: 12 años, 7 meses
Puntos: 397
Respuesta: Utilicas CSS en jerarquias en tablas

Creo que ha sido muy claro STable es diferente de STtable notas que sobra una t? ese es el error mas grave que tienes.

Lo otro es no maquetes o diseñes con tablas. Que eso se hacía hace muchos años.

Saludos
__________________
Haz preguntas inteligentes-Como ser Hacker
No hacer preguntas por mensaje privado. No sólo no es inteligente sino que es egoísta.
  #9 (permalink)  
Antiguo 29/11/2013, 10:14
Avatar de emilio_viguri  
Fecha de Ingreso: junio-2011
Ubicación: Mexico
Mensajes: 116
Antigüedad: 12 años, 10 meses
Puntos: 3
Respuesta: Utilicas CSS en jerarquias en tablas

aaa no ma deja checo perdón no ma me tenían en jaque con eso y creo que no me di cuenta lo estoy che cando


O si ya vi mi gran error entre que buscaba como hacerlo y cambiaba nombres no me di cuenta de eso y no mas se me bloque el coco gracias ...

Última edición por emilio_viguri; 29/11/2013 a las 10:19 Razón: + Detalles

Etiquetas: background, color, hover, imagenes, página, tablas
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:04.