Tabla a Div

albertcito · #1 (**permalink**) 22/05/2008, 01:21

He tratado de hacer esto pero no me resulta :S

Código HTML:

<table width="100%" border="0" cellspacing="2" cellpadding="0">
  <tr>
    <td width="9%" rowspan="3">&nbsp;</td>
    <td width="58%">&nbsp;</td>
    <td width="33%">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="2">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="2">&nbsp;</td>
  </tr>
</table>

convertirlo a div

Alguien me puede ayudar por favor o darme algún link o manual bueno por favor gracias de antemano.

jormaz · #2 (**permalink**) 22/05/2008, 03:32

<div id="contenedor" style="width:100%; border:0">
<div id="derecha" style="float:left; width:10%; height:75px; background-color:#9900FF">
</div>
<div id="izq1" style="float:left; width:90%; background-color:#993300" >
</div>
<div id="izq2" style="float:left; width:90%; background-color:#33CC66">
</div>
<div id="izq3" style="float:left; width:90%; background-color:#FF0066">
</div>
</div>

para que tengas una idea de como va,

...veras que el id="derecha" tiene altura porque si no los otros no podrían flotar a la izquierda i se pondrían debajo
...el id="contenedor tiene el ancho del 100% y contiene totos los divs
...para hacer los tres divs con el alto del de la derecha le pones height:25px a cada div

Carxl · #3 (**permalink**) 22/05/2008, 07:40

Hola albertcito, cómo vas??

Lo que te dice jormaz, tiene total validez por que es una solución a lo que buscas. Voy un poco mas allá y pregunto, que es lo que quieres representar en esa tabla?? Datos?? O buscas un diseño como tal?? Si busca un diseño, esa maquetación que te muestra jormaz, es la correcta?? Quizás se podría optimizar ese código dependiendo de lo que necesites...

Tablas para datos, div's para diseño... Cuál es la idea??

Saludos

albertcito · #4 (**permalink**) 22/05/2008, 15:32

jormaz muchas gracias por la solución :D

Y Carxl muy interesante lo que me comentas, exactamente son datos, estoy realizando un sistema de noticias con php, mysql, ajax, json..etc desde cero y sin ningún tipo de librería pues es para aprender un poco más y tengo trabajo para rato es bastante largo el asunto, pues si el proyecto no me funciona por lo menos podre vender el materia por ultimo, para recuperar el tiempo dedicado a aquello. Bueno creo que tienes toda la razón lo construiré con tablas pues la idea es algo así:
http://www.uach.cl/rrpp/online/notic...=01&m=4&a=2008

muchas gracias eso seria :D

Carxl · #5 (**permalink**) 22/05/2008, 15:38

Hola de nuevo albertcito, cómo vas??

Pues para lo que muestras, las imagenes con noticias, son datos, para ese caso, nada sustituye a las tablas.

Saludos

Mikmoro · #6 (**permalink**) 22/05/2008, 17:25

Hola a los dos.

Como simple divertimento, con este código:

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title>albertcito</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
* { margin: 0pt;
padding: 0pt;
}
.noticia { width: 700px;
margin: 30px auto;
font-family: Bitstream Vera Sans;
background-color: rgb(235, 235, 235);
}
.titular a { color: rgb(0, 91, 0);
text-decoration: none;
font-size: 0.7em;
display: block;
padding: 10px 0px;
margin-left: 160px;
}
.texto { font-weight: bold;
background-color: rgb(255, 255, 255);
font-size: 0.7em;
padding: 17px 0px 16px 12px;
margin: 0px 4px 0px 150px;
}
.fecha { margin: 4px 4px 0px 150px;
background-color: rgb(255, 255, 255);
color: rgb(179, 71, 71);
font-weight: bold;
font-size: 0.6em;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.noticia img { margin: 5px;
width: 140px;
height: 100px;
float: left;
}
.corte { clear: both;
font-size: 3px;
}
</style>
</head>
<body>
<div class="noticia"><img alt="" src="img/10247.jpg" />
<div class="titular"><a href="#">Importante
Estadía de Docente UACh en EE.UU.</a></div>
<div class="texto">El médico valdiviano,
patólogo jefe del Hospital Clínico Regional
Valdivia y profesor asociado del Instituto de Anatomía,
Histología y Patología de la Universidad Austral
de Chile, Dr. Daniel Carpio, se encue ...</div>
<div class="fecha"> 01/04/2008</div>
<div class="corte"> </div>
</div>
</body>
</html>

se consigue exactamente lo mismo. Aquí está el ejemplo

Es que no estoy nada convencido de que eso sean datos tabulados o tabulables ;-D

Mikel.

Carxl · #7 (**permalink**) 22/05/2008, 21:11

Cita:

Iniciado por albertcito

Y Carxl muy interesante lo que me comentas, exactamente son datos...

Lo ha dicho albertcito...

Saludos

Mikmoro · #8 (**permalink**) 23/05/2008, 00:45

¿Tabulados?

Claro, datos, casi todo son datos

Está claro que pueden tabularse perfectamente, pero para mi no es el caso en el que yo usaría una tabla para representarlos. Es cuestión de apreciación de cada uno.

Mikel.