Foros del Web » Creando para Internet » CSS »

Necesito pasar este párrafo table a DIV me ayudais?

Estas en el tema de Necesito pasar este párrafo table a DIV me ayudais? en el foro de CSS en Foros del Web. <table id="bodyWrapper2"><tr> <td valign="top" class="barLeft"> </td> <td class="barMiddle"> <table id="bodyWrapper"> <tr id="header3"> {% include base/base.tabs %} </tr> </thead> <tbody id="pageBody"><tr> {% block BODY %}{% end ...
  #1 (permalink)  
Antiguo 19/02/2011, 09:22
 
Fecha de Ingreso: febrero-2011
Ubicación: En Barcelona, españa
Mensajes: 26
Antigüedad: 6 años, 9 meses
Puntos: 1
Necesito pasar este párrafo table a DIV me ayudais?

<table id="bodyWrapper2"><tr>

<td valign="top" class="barLeft">

</td>

<td class="barMiddle">
<table id="bodyWrapper">
<tr id="header3">
{% include base/base.tabs %}
</tr>
</thead>
<tbody id="pageBody"><tr>
{% block BODY %}{% end %}
</tr></tbody>
<tfoot><tr>
<td colspan="2"><?php echo locale::_('FOOT_COPY', array('{date}' => '2003-' . date('Y'))); ?></td>
</tr></tfoot>
</table>

</td>

<td class="barRight"></td>

</tr></table>

------------------------------------------------------

He leido que hay que sustituir los table por div, eliminar los tr y ahi ya me pierdo......

Tengo que pasar todo eso a div.

gracias
  #2 (permalink)  
Antiguo 19/02/2011, 10:52
 
Fecha de Ingreso: febrero-2011
Ubicación: Evolandia
Mensajes: 103
Antigüedad: 6 años, 10 meses
Puntos: 10
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

Intenta esto:

<div id="bodyWrapper2" style="overflow:hidden;width: 300px">
<div class="barLeft" style="float:Left; width: 10px;">a</div>
<div class="barMiddle" style="float:left; width:280px;">
<div id="bodyWrapper">
<div id="header3">
{% include base/base.tabs %}
</div>
<div id="pageBody">
{% block BODY %}{% end %}
</div>
<div>
<?php echo locale::_('FOOT_COPY', array('{date}' => '2003-' . date('Y'))); ?>
</div>
</div>
</div>
<div class="barRight" style="float:Left; width: 10px;height:100%;">b</div>
</div>

Saludos!
  #3 (permalink)  
Antiguo 19/02/2011, 11:12
 
Fecha de Ingreso: febrero-2011
Ubicación: En Barcelona, españa
Mensajes: 26
Antigüedad: 6 años, 9 meses
Puntos: 1
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

Hola, gracias por la respuesta pero me sale todo descojonado xD

Me gustaría poder entender el sistema del div, he buscado por internet y pone algo del float y me hago un lio de la ostia.

se supone que el table crea una tabla, el td tambien y el tr una columna no?

ahora el div..... div style="clear:both;" he visto que se hace así pero me sigo liando
  #4 (permalink)  
Antiguo 19/02/2011, 11:36
 
Fecha de Ingreso: febrero-2011
Ubicación: En Barcelona, españa
Mensajes: 26
Antigüedad: 6 años, 9 meses
Puntos: 1
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

Me gustaría pillar la idea principal:

<div>
<div style="float:left">columna 1</div>
<div style="float:left">columna 2</div>
</div>

para sustituir un tr como seria? o un td?
  #5 (permalink)  
Antiguo 19/02/2011, 11:44
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

Creo que lo mejor es un manual de CSS.
En pocas palabras, un div es por defecto un elemento de bloque, lo que quiere decir que ocupará la totalidad del ancho de la página o del contenedor padre forzando un salto de línea.
Para hacer que dos div compartan la misma línea existen algunas alternativas.
Una de ellas es usar la posición flotante. Para que surta efecto, el contenedor debe tener espacio suficiente para albergar las columnas que forman los div, de otro modo, a pesar de la posición flotante ocuparán líneas diferentes.
Cuando queremos interrumpir el que los elementos floten respecto a los anteriores podemos usar la propiedad clear que puede tomar los valores right, left o both, indicando que no queremos que floten elementos a derecha, izquierda o a ninguno de los lados.
  #6 (permalink)  
Antiguo 19/02/2011, 11:47
 
Fecha de Ingreso: febrero-2011
Ubicación: En Barcelona, españa
Mensajes: 26
Antigüedad: 6 años, 9 meses
Puntos: 1
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

Si, lo sé. Era para ver si alguien me lo podia explicar con las propias palabras, en todos los manuales dice eso que dices pero me hago un lio padre sobretodo con lo del clear.

Necesito algun ejemplo claro, rollo esto es igual a esto, o quizá tengo que cambiar el concepto de tabla. yo q se!
  #7 (permalink)  
Antiguo 19/02/2011, 14:01
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 8 años, 10 meses
Puntos: 306
Respuesta: Necesito pasar este párrafo table a DIV me ayudais?

En las tablas ya vienen definido que el ancho ocupe todo el espacio disponible, viene definido que cada tr (fila) se ubique debajo del anterior, y que cada td (celda) se ubique al lado de la anterior asignandole un ancho proporcional al ancho de la tabla de manera que entren todas las td.
Por supuesto que puedes modificar este comportamiento pero este es el punto de partida de las tablas.

En las div (caja) partes de un ancho que ocupe todo el espacio disponible, si tienes por ejemplo <body><div></div></body> ocupará todo el ancho del body. Pero sumado a esto del ancho al 100% tienes que la div genera un salto de linea, es decir, no quiere que nadie se ponga a su lado (muy mal llevada por cierto, jaja), y he aquí la cuestión, o mejor dicho el problemon.
En realidad he aquí la ventaja de la div, ya que no es tan rígida su estructura como una tabla, pero al ser tan flexible debes decirle como se debe comportar, y debes decirlo en cesesiano puro (css).

Supongamos que esas div son autos en una calle de una sola mano (dirección), y que cada auto ocupa el 100% del ancho de la calle y ninguno puede adelantarse o ponerse a la par,entonces para lograrlo uno de los vehículos debe romper la leyes de tránsito (y de la gravedad) y ponerse a "flotar" por los aires, es decir salirse de la calle ("salirse del flujo del documento"), entonces el vehículo que estaba detrás pasa a ocupar el lugar del "flotado", pero como no quiere que ante algún desperfecto le caiga encima, no se pone directamente bajo el "flotador" sino que se ubica a un lado dejando un espacio vacío igual al ancho del "flotador"( cuyo ancho no debería ser del 100% porque no se notarían cambios con respecto al inicio), entonces el vehículo que se adelanta ahora ocupa el 100% del ancho disponible (100% inicial - ancho "flotador").

Ahora supongamos que son tres los "flotadores", y tienen cada uno un ancho del 40%, entonces el tercer vehículo por más que está "flotando" quedará detrás de los otros ya que los tres superan el 100% del ancho de la calle.

También supongamos que en un cuarto vehículo viene un viejo cascarrabias, que ve como los de adelante andan flotando por los aires, y que al estar él en tierra firme no le queda otra que ubicarse en el espacio disponible dejado por el tercer flotador (100% inicial - ancho "3º flotador").
Pero como no le hace gracia decide quedarse detrás de la linea de los "flotadores", ocupando el 100% del ancho de la calle, entonces activa el botón "clear" opción "both" para que nadie flote a su izquierda ni a su derecha.

Y fueron todos felices por siempre.
FIN

Bueno, otro día probamos con naranjas y dioses del Olimpo.


Acá te dejo un articulo serio sobre el tema que no tengo dudas te va a aclarar muchísimo el panorama:
http://www.araudi.net/migracion/migr...sin_dolor.html
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--

Última edición por C2am; 19/02/2011 a las 14:07 Razón: Enlace sin dolor

Etiquetas: pasar, párrafo, table
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:45.