Foros del Web » Creando para Internet » CSS »

Problema css para noticias dinamicas

Estas en el tema de Problema css para noticias dinamicas en el foro de CSS en Foros del Web. Hola a todos. La cuestion es simple... Tengo que sacar a la vista noticias de forma dinamica, distribuidas en dos columnas. El problema con el ...
  #1 (permalink)  
Antiguo 23/11/2009, 09:42
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Problema css para noticias dinamicas

Hola a todos. La cuestion es simple...

Tengo que sacar a la vista noticias de forma dinamica, distribuidas en dos columnas. El problema con el que me encuentro se puede ver aqui.

http://playas.lmrstudio.com/

Hay alguna forma de solucionar esto, o alguna otra forma de realizarlo??

Por favor, es urgente.
  #2 (permalink)  
Antiguo 23/11/2009, 11:11
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Problema css para noticias dinamicas

Prueba reduciendo el ancho de las imagenes, de hay pude venir el descuadre.

Saludos¡¡
  #3 (permalink)  
Antiguo 23/11/2009, 14:14
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Respuesta: Problema css para noticias dinamicas

no, por eso no es seguro.
  #4 (permalink)  
Antiguo 23/11/2009, 15:55
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Problema css para noticias dinamicas

Hola:

Tienes los div's noticia flotados a la izquierda, hasta aquí bien. Los dos primeros se colocan bien, el tercero al no caber en el contenedor "salta" a la línea siguiente y lógicamente flota a la izquierda pero como la segunda noticia tiene un height inferior a la primera se posiciona en el primer hueco que encuentra a la izquierda lo que hace que se posicione debajo de la segunda noticia.

Una solución sería poner las imágenes con el mismo height y que el texto ocupara siempre el mismo espacio de forma que los div's tengan el mismo tamaño o darle a los div's un height fijo lo que implicará que cuanto más grande sea la foto menos texto se podrá visualizar.

No se si me he explicado, si no me has entendido vuelve a preguntar e intentaré hacerlo mejor.

Saludos.



P.D: He probado a ponerle al div noticia un height:725px y mejora.

Última edición por jomaruro; 23/11/2009 a las 15:58 Razón: Añadir P.D.
  #5 (permalink)  
Antiguo 23/11/2009, 16:18
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Respuesta: Problema css para noticias dinamicas

Muchas gracias por tu ayuda.

Lo que me explicas lo entiendo perfectamente y se que es una solucion, pero no quiero que sea asi como trabaje la visualizacion.

Como ejemplo, te puedo dirigir a la pagina de marca
http://www.marca.com/index.html?a=fd...c&t=1259014094

El efecto que busco es el mismo. Tengo claro que ello no manejan contenido dinamico, pues simplemente tienen dos columnas administradas manualmente por sus webmasters.

La movida es que mi pagina es contenido dinamico 100%. Con ello me refiero a que el usuario elije el texto que quiere mostrar, las imagenes pueden ser de distinto tamaño, con distintas alineaciones de la imagen, etc etc.

El problema viene en lo que me sucede. Realmente otra alternativva que encontre en posicionar una capa en left y otra en right alternativamente, pero sufro que al no manejar un height fijo, cabe la posibilidad que una columna me quede muy ancha y otra muy estrecha.

Quiza, la unicas alternativas que se me ocurren sean dos:

1. Coger el height resultante de cada capa y ir posicionandoles en base al tamaño de estas para que se vayan igualando, lo cual conlleva uso de javascript y no creo adecuado su uso en este tema.

2. Darle al cliente la posibilidad de elejir en que columna aparecera y asi que distribulla el contenido visualmente. El problema es que cada vez que se introduzca una neuva noticia, se debera ehar un ojo y seguramente será necesario modificar alguna otra para regularlo de nuevo.

Bueno, haber si Dios me da esperanza con una mente mas lucida o alguien que haya pasado por el mismo problema.

Gracias.
  #6 (permalink)  
Antiguo 24/11/2009, 13:33
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Problema css para noticias dinamicas

Hola:

Por lo que he visto en la página del marca, la solución es fácil, el contenido lo divide en dos columnas flotadas a la izquierda (sin contar la columna de la derecha, la de la publicidad) y dentro de cada una de ellas distintos div, uno por cada noticia tal y como los tienes tú.

Creo que lo puedes adaptar a tu diseño.

Saludos.

  #7 (permalink)  
Antiguo 24/11/2009, 14:39
 
Fecha de Ingreso: enero-2007
Mensajes: 157
Antigüedad: 10 años, 10 meses
Puntos: 2
Respuesta: Problema css para noticias dinamicas

div#contenedor { width: 100%; }
div#col_izquierda { width: 50%; float: left; }
div#col_derecha { width: 50%; float: left; }
div#noticia { width: 100%; }

<div id="contenedor">

<div id="col_izquierda">
<div class="noticia">........contenido.........</div>
<div class="noticia">........contenido.........</div>
</div>

<div id="col_derecha">
<div class="noticia">........contenido.........</div>
<div class="noticia">........contenido.........</div>
</div>

</div>
  #8 (permalink)  
Antiguo 24/11/2009, 16:10
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Respuesta: Problema css para noticias dinamicas

Lo primero, respecto al codigo, se agradece, pero no era en absoluto necesario...

Lo segundo, creo que dijo jomaruro. Entiendo perfectamen te como esta distribuida la pagina de marca, pero tambien se claramente que las noticias que ahi salen no son dinamicas, segurisimo.

Para que me entiendan mejor, la distribucion que intento conseguir es simple.

- Las ultimas noticias siempre arriba
- Que se vayan posicionando a los lados alternativamente, pero sin dejar hueco.

Haber si esta imagen os lo explica mejor y se os ocurre una alternativa o una forma de hacerlo sin javascript:

  #9 (permalink)  
Antiguo 08/12/2009, 16:27
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Respuesta: Problema css para noticias dinamicas

Bueno, aun sigo con el mismo problema. Ha nadie se le ocurre ninguna idea?

La forma de visualizarlo tiene que ser compatible con poner imagenes de distintos tamaños (o sin imagen) y textos de distinta envergadura.

Alguna mente lucida?
  #10 (permalink)  
Antiguo 08/12/2009, 20:46
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.049
Antigüedad: 8 años, 7 meses
Puntos: 1484
Respuesta: Problema css para noticias dinamicas

comprendo tu problema pero el layout que quieres lograr no se puede hacer con float. en la siguiente direccion, leete las 9 normas que se rige la propiedad float. http://www.mykiss.de/ch08_03.htm#css-CHP-8-SECT-3.1
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #11 (permalink)  
Antiguo 09/12/2009, 08:38
 
Fecha de Ingreso: diciembre-2007
Mensajes: 77
Antigüedad: 10 años
Puntos: 3
Respuesta: Problema css para noticias dinamicas

He encontrado una solucion parcial pero la implementacion es incompleta.

He sacada la altura de la imagen y la media del numero de lineas segun el texto.
Una vez esto, he sumado las dos cantidades y estas las voy sumando a una variable de la columna izquierda o derecha segun corresponda, para asi despues flotarlas a la izquierda o a la derecha.

El problema que tengo, es que la medicion es imprecisa, principalmente por el tema del texto. Por ello, me gustaria saber si hay alguna forma de medir el tamaño de la capa donde esta situada el texto con PHP.

Como podeis ver, he conseguido lo que me proponia, pero el resultado, logicamente es impreciso.
http://www.playas.lmrstudio.com

Haber si encontramos la forma....
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:44.