Ver Mensaje Individual
  #5 (permalink)  
Antiguo 26/08/2010, 13:44
kseso?
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 6 meses
Puntos: 539
Respuesta: generacion de Div a partir de una BD y PHP

Revise la anchura de la caja contenedora de esos div´s como le comentaba anteriormente.
Pruebe lo siguiente en el navegador:
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
  3. <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
  4. <title>Kseso? Jugando con css</title>
  5.  
  6. <style type="text/css">
  7. * {margin: 0; padding: 0; outline: 0; position: relative;}
  8. .articuloprensa {
  9.     float:left;
  10.     width:375px;
  11.     height:250px;
  12.     margin:3px;
  13.     background-color:#6FF;
  14. }
  15. .articuloprensa img {
  16.     width:375px;
  17.     height:160px; /*ojo al alto y ancho, hay distorsión*/
  18.     background-color:#FFF;
  19.     margin: 0 auto;
  20.     display: block;
  21. }
  22.  
  23. .articuloprensa p { font-size: .9em;}
  24. </head>
  25.   <div id="contenedor">
  26.     <div class="articuloprensa">
  27.       <img src="http://farm2.static.flickr.com/1337/831326806_17f1a0c3bb.jpg?v=0" alt="#"/>
  28.       <p>Lorem ipsum dolor sit amet consectetuer leo sodales nunc quis Aenean. Dui Morbi Morbi id ante Nullam urna velit quis interdum cursus. Mollis cursus ac consequat Aliquam dictumst.</p>
  29.     </div>
  30.     <div class="articuloprensa">
  31.       <img src="http://heterodoxia.files.wordpress.com/2009/07/carajillo.jpeg" alt="#"/>
  32.       <p>Lorem ipsum dolor sit amet consectetuer metus Sed ac Nam neque. Et at Pellentesque Phasellus id penatibus sem hac Suspendisse mollis ut. Justo enim nulla Nullam Quisque neque dui justo nisl ut Aliquam. Tortor risus malesuada sagittis.</p>
  33.     </div>
  34.     <div class="articuloprensa">
  35.       <img src="http://www.milrayas.com/blog/wp-content/uploads/2007/08/carajillo_bolsillo.jpg" alt="#"/>
  36.       <p>Lorem ipsum dolor sit amet consectetuer porttitor libero congue justo Phasellus. Curabitur augue tempor leo vitae lacus elit nunc id Vestibulum Suspendisse. Nibh convallis ultrices.</p>
  37.     </div>
  38.   </div>
  39. </body>
  40. </html>
No verificado en otros distintos a ff. Como verá, es su código pero variando el etiquetado en el html según le apuntaba anteriormente.