Foros del Web » Creando para Internet » CSS »

Capa por detras de tabla

Estas en el tema de Capa por detras de tabla en el foro de CSS en Foros del Web. Hola buenas, llevo bastante tiempo consultando mis dudas con vosotros y aprovecho para agradeceros enormemente la labor que estáis haciendo. Después de mucho tiempo peleandome ...
  #1 (permalink)  
Antiguo 08/04/2008, 04:16
 
Fecha de Ingreso: febrero-2008
Mensajes: 40
Antigüedad: 9 años, 10 meses
Puntos: 0
Capa por detras de tabla

Hola buenas, llevo bastante tiempo consultando mis dudas con vosotros y aprovecho para agradeceros enormemente la labor que estáis haciendo. Después de mucho tiempo peleandome con esto, no me queda más remedio que pediros ayuda, a ver si hay suerte. En principio creo que la solución no es difícil, pero se me resiste.

El tema es: Teniendo en cuenta que tengo una tabla (tiene que ser una tabla, no otra capa) como podría hacer para que a ésta tabla le atravesase una capa por detrás. En el ejemplo, tengo una tabla con un ancho de 500px. Lo que busco es que haya una capa de por ejemplo width="100%" de color rojo y la tabla quede encima de ésta capa. No sé si me explico.

Un saludo y muchas gracias.

Código HTML:
<html>
  <head>
    <title>Tabla</title>
  </head>

  <body>
    <Table width="500px" cellpadding="10" cellspacing="0" border="1" align="center">
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
    </Table>
  </body>
</html> 
  #2 (permalink)  
Antiguo 08/04/2008, 04:23
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Capa por detras de tabla

Hola, thorr.

Pues habría varias formas de hacerlo, pero todo depende de cómo quieras que quede.

Por ejemplo, podrías ponerle ese color rojo al body.
Podrías crear una caja que envolviera tu tabla:

<div id="envoltorio">
<table....
</table>
</div>

y en la css

#envoltorio {
width: 100%;
background-color: #f00;
}

Si concretas más la ayuda podrá ser más concreta.

Mikel.
  #3 (permalink)  
Antiguo 08/04/2008, 04:23
Avatar de PedroRodas  
Fecha de Ingreso: noviembre-2005
Ubicación: Cádiz
Mensajes: 393
Antigüedad: 12 años
Puntos: 0
Re: Capa por detras de tabla

cual es el resultado que quieres conseguir, no te entendido muy bien. explicate un poco por favor.
  #4 (permalink)  
Antiguo 08/04/2008, 04:37
 
Fecha de Ingreso: febrero-2008
Mensajes: 40
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: Capa por detras de tabla

Muchas gracias por responder. Y qué rápido además!

A ver...si, lo que a echo Mikel se aproxima bastante, pero lo que me gustaría es que una barra horizontal le atraviese por detrás a la tabla, sin que ocupe toda su altura. Por ejemplo, si la tabla es blanca, que le atraviese una barra roja por detrás (la tabla seguirá siendo blanca) pero sin ocupar toda su altura. Pongo el código de cómo ba el asunto con lo que tenía yo escrito, y lo que ha echo mikel:

Código HTML:
<html>
  <head>
    <title>Tabla</title>
  </head>
<link rel="stylesheet" href="estilos.css" type="text/css"/>
  <body>
  	<div id="envoltorio">
    <Table width="500px" cellpadding="10" cellspacing="0" border="1" align="center" bgcolor="white">
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
      <Tr>
	<Td align="center">Texto de relleno</Td>
      </Tr>
    </Table>
    </div>
  </body>
</html> 
Código HTML:
el css:
#envoltorio {
width: 100%;
background-color: #f00;
}
Muchas gracias de nuevo!! (espero que se me haya entendido)
  #5 (permalink)  
Antiguo 08/04/2008, 05:13
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Capa por detras de tabla

¿Algo así?

Cita:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="es-es">
<head>
<title>Tabla</title>
<style type="text/css">
* { margin: 0px;
padding: 0px;
}
#franja { width: 100%;
background-color: rgb(255, 0, 0);
margin-top: -100px;
z-index: 1;
position: relative;
height: 50px;
}
table { margin: 0px auto;
z-index: 10;
position: relative;
}
</style>
</head>
<body>
<table align="center" bgcolor="white" border="1" cellpadding="10" cellspacing="0" width="500">
<tbody>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
<tr>
<td align="center">Texto de relleno</td>
</tr>
</tbody>
</table>
<div id="franja"></div>
</body>
</html>
Mikel.
  #6 (permalink)  
Antiguo 08/04/2008, 05:19
 
Fecha de Ingreso: febrero-2008
Mensajes: 40
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: Capa por detras de tabla

Cita:
Iniciado por Mikmoro Ver Mensaje
¿Algo así?

Mikel.
Clavau. Gracias de nuevo.
  #7 (permalink)  
Antiguo 08/04/2008, 09:00
 
Fecha de Ingreso: febrero-2008
Mensajes: 40
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: Capa por detras de tabla

No! me acabo de dar cuenta de que no me sirve...

El tema es, que lo que necesito es ponerle un menu en la parte superior de la tabla. El menú está prefabricau, pero con el position relative de la tabla se vuelve loco.Cuando pongo el ratón sobre un link del menú, el submenú de éste sale lejos de donde devería hacerlo.

el menú es el siguiente: http://www.4thorder.us/Scripts/Scripts/JS.DHTMLMenuExpander/

Y si le quito el position relative, la banda de atrás se pone delante. Por eso lo preguntaba de ésta manera. Bueno, tranquilos, bastante habeis echo con ayudarme hasta ahora. Si no os apetece dejadlo, yo ya lo doy por imposible. Bueno, muchas gracias!
  #8 (permalink)  
Antiguo 08/04/2008, 09:25
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Capa por detras de tabla

No debes darlo por imposible, pero como vés, sí es imprescindible dar todos los elementos para que se pueda saber qué se debe hacer, si no, a ti como a otras 100 consultas, das una solución que no sirve porque no encaja con los elementos de tu página que no has descrito. Esto es un poco desesperante, la verdad.

Yo en cuanto pueda te hecho un cable, pero para eso pon todo tu código html y css o un enlace donde se pueda ver tu página, si no, volveremos a cometer el mismo error una y otra vez.

Mikel.
  #9 (permalink)  
Antiguo 09/04/2008, 11:22
 
Fecha de Ingreso: febrero-2008
Mensajes: 40
Antigüedad: 9 años, 10 meses
Puntos: 0
Re: Capa por detras de tabla

Aupa, muchas gracias Mikel. Acabo de tomar como decisión solucionarlo de una forma bastante más cobarde: Buscar otra barra de enlaces prefabricada.

En cuanto a lo de poner parte del código, tienes toda la razón del mundo, pero a mí me da un poco de reparo poner aquí la dirección y luego poniendolo en un buscador aparezcan éstos mensajes. Por eso, puse trozos simplificados de lo que buscaba.

Bueno, saludos!
  #10 (permalink)  
Antiguo 09/04/2008, 11:32
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Capa por detras de tabla

Sí, lo sé. Disculpa. A mucha gente le da reparos poner el código completo por lo que has dicho, o por mostrar su diseño inacabado, etcétera.

Lo que se puede poner es al menos la esctructura completa, aunque le quites los contenidos, la css completa, y así.

Si quieres que echemos un vistazo a cómo lo tenías con el menú que ya te funcionaba bien, si quieres mándame por privado la url de tu web y vemos si es posible solucinarlo sin una medida "drástica" , y luego si encontramos una solución válida la posteamos aquí.

Mikel.
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 11:16.