Foros del Web » Creando para Internet » CSS »

Problema CSS & Tablas

Estas en el tema de Problema CSS & Tablas en el foro de CSS en Foros del Web. Mi problema es "sencillo"... Estoy desarrollando un sitio con ancho definido "fixed layout"; éste ancho varía segun la resolución del usuario (800 ó 1024 pixeles ...
  #1 (permalink)  
Antiguo 14/06/2007, 12:11
 
Fecha de Ingreso: marzo-2006
Mensajes: 66
Antigüedad: 11 años, 9 meses
Puntos: 0
Problema CSS & Tablas

Mi problema es "sencillo"...

Estoy desarrollando un sitio con ancho definido "fixed layout"; éste ancho varía segun la resolución del usuario (800 ó 1024 pixeles segun el monitor). Tiene 2 columnas flotantes a cada lado y un contenedor principal con márgenes (una estructura bastante sencilla y común):

--------------------
| | | |
| | | |
| | | |
| | | |
| | | |
--------------------

Ahora bien, mi objetivo es tener otras 2 columnas adentro de mi contenedor (cada una tendrá una imagen e información). Quiero que se mantengan también centradas y equidistantes con mis 2 columnas flotantes.

No soy amigo de las tablas (solo las utilizo para lo que son: para tabular información), sin embargo con ellas bastaría algo así:

Código:
<div id="contenedor">
<table style="width:100%">
 <tr>
  <td style="text-align:center">IMAGEN E INFO</td>
  <td style="text-align:center">IMAGEN E INFO</td>
 </tr>
</table>
</div>
También he intentado flotar otra columna adentro del contenedor, y hacer la otra con un simple <div>, sin embargo la columna flotante no se mantiene equidistante como con la tabla, además no puedo agregar más contenido abajo de estas 2 columnas internas porque no puedo uitlizar "clear:both" (al hacerlo mi contenido se baja todo, pasando mis 2 columnas flotantes principales, ésto es un gran problema, me limita a no usar float). (cabe mencionar que mi contenido es dinámico y por lo tanto la altura de las 2 columnas internas es variable)


Tampoco quiero utilizar "display:table"..etc en mis divs, no quiero que los <divs> emulen tablas (ademas IE7 no soporta ya estas propiedades CSS).

Estarán de acuerdo que lo que quiero no es tabular información, ésto lo debería hacer con <divs> y CSS y no con tablas.

Finalmente me gustaría (de ser posible) que cuando se cambie el tamaño de la pantalla (se haga más angosta) y las 2 columnas internas no quepan en el espacio nuevo se coloque una debajo de otra. (se que con float se podría lograr algo así pero no lo puedo utilizar, mi pregunta también es ¿es posible este comportamiento con tablas?, ¿qué las celdas se coloquen una abajo de otra una ves que se agotó el espacio?).

Bueno, de antemano quiero dar las gracias a todos los que me ayuden o contribuyan con este problema.

Gracias!
  #2 (permalink)  
Antiguo 14/06/2007, 17:58
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 12 años, 9 meses
Puntos: 9
Re: Problema CSS & Tablas

Cita:
display:table
No puedo creer que exista tal cosa. ,·un estilo para hacer tablas·, ¿no es como la serpiente que se muerde la cola ,o algo asi?
  #3 (permalink)  
Antiguo 15/06/2007, 06:29
 
Fecha de Ingreso: marzo-2006
Mensajes: 66
Antigüedad: 11 años, 9 meses
Puntos: 0
Re: Problema CSS & Tablas

Así es, existe pero IE no lo permite... He aquí un pequeño ejemplo:

CSS
Código:
<style type="text/css">
div.table {
display:table;
width:100%;
}

div.tr {
display:table-row;
}

div.td {
display:table-cell;
}
</style>
HTML
Código:
<div class="table">
 <div class="tr">
  <div class="td">
   Celda #1
  </div>
  <div class="td">
   Celda #2
  </div>
  <div class="td">
   Celda #3
   </div>
 </div>
</div>
Pero hacer esto es la peor forma de utilizar los <divs> :S, es como maquetear un sitio con tablas. Un saludo!
  #4 (permalink)  
Antiguo 16/06/2007, 03:23
Avatar de k4k4  
Fecha de Ingreso: junio-2007
Ubicación: Baja California, México
Mensajes: 120
Antigüedad: 10 años, 6 meses
Puntos: 6
Re: Problema CSS & Tablas

Hola,

no entendí a la perfección el tipo de layout que estas tratando de lograr. Si manejas un fixed layout una opción es flotar todo y declarar a todas las columnas el width, todo bien medido y usar margenes para mantener las distancias iguales.

Tienes algún demo?

Saludos,

k4
  #5 (permalink)  
Antiguo 16/06/2007, 09:44
 
Fecha de Ingreso: marzo-2006
Mensajes: 66
Antigüedad: 11 años, 9 meses
Puntos: 0
Re: Problema CSS & Tablas

Bueno, resulta dificil que yo explique tantas cosas y no ponga ni una imagen...

He particionado mi problema en varios "sub-problemas", postearé el primer sub-problema como un nuevo tema.

Gracias!
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 20:52.