Foros del Web » Creando para Internet » CSS »

Pocisionamiento dinámico de bloques ¡¡AYUDA!!

Estas en el tema de Pocisionamiento dinámico de bloques ¡¡AYUDA!! en el foro de CSS en Foros del Web. Buenas a todos! La duda que tengo en este minuto es existencial para el proyecto que estoy desarrollando. Estoy comenzando a maquetear con CSS una ...
  #1 (permalink)  
Antiguo 29/12/2008, 08:12
 
Fecha de Ingreso: agosto-2008
Ubicación: Santiago
Mensajes: 20
Antigüedad: 9 años, 3 meses
Puntos: 2
Exclamación Pocisionamiento dinámico de bloques ¡¡AYUDA!!

Buenas a todos!

La duda que tengo en este minuto es existencial para el proyecto que estoy desarrollando.

Estoy comenzando a maquetear con CSS una página de e-commerce la cual por ahora va bien pero me estoy enfrentando a la típica página que abres una categoría y te aparecen todos los productos (con la típica opción mostrar 6, 9, 12, o todos los productos a través de un combobox).

La estructura del sitio esta hecha con divs absolutos (o sea TODO FLOTA ) pero aca tengo la pregunta del millón.

Tengo que hacer un bloque para la información resumida del producto, la cual se va a rellenar con las consultas php, y la misma se va a tener que repetir hacia abajo o hacia la derecha dependiendo del caso.

EXISTE ALGUNA MANERA DE CREAR SOLO UNA CAJA CON LA INFO Y QUE LA POSICION SE ASIGNE DINAMICAMENTE EJECUTANDO ALGUNA FUNCIÓN QUE LA UBIQUE EXACTAMENTE A "X" PIXELES DE LA ANTERIOR?
  #2 (permalink)  
Antiguo 29/12/2008, 08:25
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Pocisionamiento dinámico de bloques ¡¡AYUDA!!

Hola Tinchoy2k
No acabo de imaginarme bien tu composición, pero pese a ello te comento:
Todo elemento posicionado como "absolute" toma como referencia o punto '0,0' la esquina superior izquierda del primer antecedente (padre, abuelo, etc) que lo contenga y que tenga como posición "relative"

Así que si todas tus cajas contenedoras las has posicionado con valor absoluto, tomarán como referencia el "body".

Por cierto, que existe una contradicción en tu exposición: si todo es "absoluto" no pueden "flotar", les estás marcando una posición determinada, con independencia del resto de elementos.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #3 (permalink)  
Antiguo 29/12/2008, 09:07
 
Fecha de Ingreso: agosto-2008
Ubicación: Santiago
Mensajes: 20
Antigüedad: 9 años, 3 meses
Puntos: 2
Respuesta: Pocisionamiento dinámico de bloques ¡¡AYUDA!!

De repente viendo esta imagen quede más claro el ejemplo



a ver si tienen alguna idea de como hacerlo
  #4 (permalink)  
Antiguo 29/12/2008, 13:58
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
Respuesta: Pocisionamiento dinámico de bloques ¡¡AYUDA!!

Cita:
Iniciado por kseso? Ver Mensaje
Hola Tinchoy2k
... que lo contenga y que tenga como posición "relative"
No necesariamente tiene que ser 'relative', si el padre tiene absolute pasa lo mismo y calculo que con fixed tambien (aunque nunca lo probe).

TiNCHOY2k: Para lo que quieres hacer, lo mejor es que no posiciones nada absolutamente. Sino que le asignes una clase a todos los bloques de productos y que flotes los bloques que contengan dicha clase.

Ejemplo sencillo:

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
<!--
.contenedorDEproductos { border:1px solid #000; float:left; width:600px; }
.producto { border:1px solid #666; float:left; margin:1%; padding:1%; width:29%; }
-->
</style>
</head>
<body>
<div class="contenedorDEproductos">
	<div class="producto">
		<h1>Producto 1</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
	<div class="producto">
		<h1>Producto 2</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
	<div class="producto">
		<h1>Producto 3</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
	<div class="producto">
		<h1>Producto 1</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
	<div class="producto">
		<h1>Producto 2</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
	<div class="producto">
		<h1>Producto 3</h1>
		<p>Descripcion descripcion descripcion descripcion descripcion descripcion</p>
	</div>
</div>
</body>
</html>
__________________
oohh... quisiera ser godines!!!
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 19:40.