Foros del Web » Creando para Internet » CSS »

Centrar Tabla, pero solo la tabla, sin mas código

Estas en el tema de Centrar Tabla, pero solo la tabla, sin mas código en el foro de CSS en Foros del Web. Hola a todos Antes de que me digais que la consulta ha sido respondida infinidad de veces, busqué en el foro, y ninguna de las ...
  #1 (permalink)  
Antiguo 16/11/2005, 14:33
 
Fecha de Ingreso: octubre-2004
Mensajes: 143
Antigüedad: 13 años, 1 mes
Puntos: 0
Centrar Tabla, pero solo la tabla, sin mas código

Hola a todos

Antes de que me digais que la consulta ha sido respondida infinidad de veces, busqué en el foro, y ninguna de las soluciones que se dieron sirvió, asi que pregunto porque me imagino que son muchos los que tienen el mismo problema que yo tengo ahora.

Es bien simple... tengo una tabla dentro de una capa y quiero centrarla, solo con CSS. El código de la tabla es el siguiente

Código:
<table  class="tabla_listado" summary="Detalle completo de Proyecto de Investigaci&oacute;n gal" >
<caption>
	Detalle de Proyecto de Investigaci&oacute;n gal
</caption>
<tr >
	<th > T&iacute;tulo</th>
	<td >:</td>
	<td ><strong>gal</strong></td>
</tr>
<tr >
	<th >Fecha de Inicio</th>
	<td >:</td>
	<td >10 de Noviembre de 2004</td>
</tr>
<tr >
	<th >Fecha de Termino</th>
	<td >:</td>
	<td >15 de Noviembre de 2005</td>
</tr>
<tr >
	<th >Tipo de Participaci&oacute;n</th>
	<td >:</td>
	<td >Colaborador</td>
</tr>
<tr >
	<th >Tipo de Proyecto</th>
	<td >:</td>
	<td >Tesis de Postgrado</td>
</tr>
<tr >
	<th >Estado del Proyecto</th>
	<td >:</td>
	<td >En avance</td>
</tr>
<tr >
	<th >Instituci&oacute;n donde se efectu&oacute;</th>
	<td >:</td>
	<td >Universidad de Chile</td>
</tr>
<tr >
	<th >Keywords</th>
	<td >:</td>
	<td >jj rr</td>
</tr>
</table>
Si se dan cuenta, nada muy raro, solo html simple y silvestre. Ahora el estilo quye lke da forma a esta tabla

Código:
table.tabla_listado
{
   font:11px Tahoma, Verdana , Arial , Sans;
   margin-left: auto;
   margin-right: auto;
   display: inline ;
}
table.tabla_listado th
{
   width:35%;
}
table.tabla_listado td + td
{
   width:60%;
}
Ahora, el asunto es por que la tabla no se centra??? Probe tambien con text-align: center; en table.tabla_listado, y se centró el texto, pero no la tabla..

AYUDAAAAA!!!

Ahh.. lo otro es que no puedo colocar ningun div mas u otro objeto, nada mas, solo con el CSS, tengo que centrarla

Gracias de Antemano
  #2 (permalink)  
Antiguo 16/11/2005, 14:39
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Quítale el
Código:
display:inline
saludos,
__________________
Al final del día hablar es gratis, codificar no lo es
  #3 (permalink)  
Antiguo 16/11/2005, 15:37
 
Fecha de Ingreso: octubre-2004
Mensajes: 143
Antigüedad: 13 años, 1 mes
Puntos: 0
Ya lo hice..

Lo que pasa, es el problema es que le doy un ancho a la tabla... ese es el problema, al eliminar ese código (todo el th y td+td en la hoja de estilo) la tabla se centra... PERROOO, el problema es que queda "incontrolable", o sea, el ancho es dado por el contenido, de manera que no lo puedo controlar..

Lo otro que no puedo hacer es tratar de definir un width que se agrande... no se si se entiende , o sea poner width:50%, y que cuando el contenido exceda el 50%, no haga un quiebre de linea, sino que continue, hasta que ocupe el tamaño de la capa, y recien ahí se produzca el quiebre de linea...

Bueno, espero que se entienda

Saludos !!!!
  #4 (permalink)  
Antiguo 16/11/2005, 16:03
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Cita:
Iniciado por jotamachuca
el problema es que queda "incontrolable", o sea, el ancho es dado por el contenido, de manera que no lo puedo controlar..
Lo de aquí arriba no lo entiendo!
Cita:
Iniciado por jotamachuca
poner width:50%, y que cuando el contenido exceda el 50%, no haga un quiebre de linea
Para lo de acá abajo, prueba con la función "nowrap" en HTML
Código HTML:
<td nowrap...
ó en CSS
Código:
white-space: nowrap;
, aquí un link para HTML: http://es.tldp.org/Manuales-LuCAS/do...7.html#AEN2927 y otro para XHTML+CSS: http://www.mailxmail.com/curso/infor...capitulo16.htm

saludos,
__________________
Al final del día hablar es gratis, codificar no lo es

Última edición por baccxus; 16/11/2005 a las 16:08
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 22:49.