Hola Hvaliente:
no dices qué estructura quieres conseguir. Así que te pongo una donde las imágenes está a la derecha con su texto a la izquierda. Y cada bloque de texto-imagen en su línea (en la horizontal)
Si lo que quisieras es que se posicione cada '.marco_der' uno al lado del otro, sólo tienes que aumentar (o eliminar) el #contenedor y a cada '.marco_der' flotarlo (mejor 'left' para que lo veas de izq a derecha según los vas escribiendo en el html) dándole una anchura.
Las imágenes que utilizo tienen todas las mismas medidas por estética.
Bueno, mira a ver este código y en base a él comentamos.
Código html:
Ver original<!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"> <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" /> * {margin:0;padding:0; border:0; outline:none; position: relative;}
#contenedor {
width:600px;
margin:0 auto;
border:1px solid #444;
overflow:hidden;
}
.marco_der {
margin-left: 10px;
overflow: hidden;
}
.marco_der p {
font-size:1em;
font-style:italic;
}
.marco_der h3 {
font-size: 1.2em;
}
.marco_der img {
float:right;
border: 1px solid #CCC;
padding: 5px;
margin: 0 5px 5px 0;
background: #555;
}
<div class="marco_der"><img src="index2_files/1.jpg" /><h3>PRIMERA CAJA:
</h3> <p>Proin congue aliquet mi. Nullam sodales sodales diam. In a dolor. Morbi placerat lacus quis leo. Aliquam quam quam, condimentum ut, sollicitudin non, eleifend ut, lorem. Phasellus enim. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In pulvinar placerat risus. Maecenas vulputate ultrices purus. Nunc vehicula ipsum at sapien.
</p></div>
<div class="marco_der"><img src="index2_files/2.jpg" /><h3>SEGUNDA CAJA:
</h3> <p>Etiam consectetuer tristique sapien. Suspendisse augue diam, malesuada in, blandit at, rutrum a, arcu. Nunc lectus dolor, faucibus sit amet, accumsan eu, consectetuer eu, orci. Duis ut erat. Phasellus orci velit, porttitor a, placerat vitae, fringilla sed, lorem. Vestibulum aliquet erat consectetuer justo. Quisque eget lectus eu ipsum feugiat accumsan. Phasellus orci velit, porttitor a, placerat vitae, fringilla sed, lorem. Vestibulum aliquet erat consectetuer justo. Quisque eget lectus eu ipsum feugiat accumsan.
</p></div>
<div class="marco_der"><img src="index2_files/3.jpg" /><h3>TERCERA CAJA:
</h3><p>Duis venenatis tellus vel odio. Pellentesque condimentum mollis tortor. Nullam imperdiet auctor wisi. Quisque sed dui ut nibh vulputate sagittis. Donec ac sem
</p></div>
Un saludo