hacer dos capas div paralelas

[azaz]

puedo poner dos capas div alineadas entre si osea en una una imagen y a la derecha titulo y comentario y que cuando se incremente queden juntos las dos capas de arriba con las dos siguientes algo asin:

-----------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
------------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
-----------------------------------------------------------------------------------------------------------

espero que se me entienda saludos

[TEPO]

Hacer lo que vos estas mostrando se puede, no es tan complicado, pero hay algo que no logro entender, cuando decis "Cuando se incremente queden juntos las dos capas de ariba con las dos siguientes", eso me descoloca, no entiendo. Fijate si podes mandar algun ejemplo u poco mas grafico.- Saludos.-

[azaz]

-----------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
------------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
-----------------------------------------------------------------------------------------------------------

si esto es lo que quiero



-----------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
-----------------------------------------------------------------------------------------------------------


-
-----------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
---------------------------------------------------------------------------------------------------------



-----------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
------------------------------------------------------------------------------------------------------------


------------------------------------------------------------------------------------------------------------
IMA titulo
GEN comentario
-----------------------------------------------------------------------------------------------------------

esto es lo que no quiero lo entiendes ahora espero que si saludos

[TEPO]

Te paso un codigo, tene en cuenta que en css, tenes la posibilidad de hacer las mismas cosas de diferentes maneras, esto es algo que te arme rapido para que lo veas, hay una pequeña diferencia con explorer, pero eso se arregla cambiando y manejando las medidas de las fotos y las demas cajas, espero que te sirva, el link donde esta subido el ejemplo es este:
http://web-t.com.ar/

El html:

Código:

<div id="contenedor">
       <div id="foto1">Foto</div>
       <div id="texto1">
		<p><h3>Titulo</h3></p>
		<p>Comentario:
                 Lorem ipsum dolor sit amet, consectetur 
                 adipiscing elit. Cras vitae tellus volutpat 
                 est posuere tincidunt quis eu tortor. 
                 Etiam quis neque eu nibh lobortis viverra. 	
                </p>
	</div>
        <div id="foto2">Foto</div>
		<div id="texto2">
		<p><h3>Titulo</h3></p>
		<p>Comentario:
                 Lorem ipsum dolor sit amet, consectetur 
                 adipiscing elit. Cras vitae tellus volutpat 
                 est posuere tincidunt quis eu tortor. 
                 Etiam quis neque eu nibh lobortis viverra. 	
		</p>
	</div>
</div>

El css:

Código:

#contenedor{
	width:502px;
	height:260px;
	position:absolute;
}
#foto1{
	border:1px solid black;
	width:82px;
	height:82px;
	position:absolute;
}
#texto1{
	width:405px;
	height:82px;
	position:absolute;
	left:90px;
	border:1px solid red;
}
#texto1  h3{
	width:100px;
	height:30px;
	position:absolute;
	top:-20px;
}
#foto2{
	border:1px solid black;
	width:82px;
	height:82px;
	position:absolute;
	top:95px;
}
#texto2{
	width:405px;
	height:82px;
	position:absolute;
	left:90px;
	top:95px;
	border:1px solid red;
}
#texto2 h3{
	width:100px;
	height:30px;
	position:absolute;
	top:-20px;	
}

Espero que te sirva.

[azaz]

bueno gracias me lo mirare mas o menos si es lo que quiero pero sin la hoja de css tan llena una cosa el id es lo mismo que el class?

no entiendo porque pusistes el primer div con id contenedor no lo entendi ese div

[azaz]

con que mueves las etiquetas para arriba y para abajo?

[TEPO]

Obvio que hay que retocar el css, yo lo hice en forma rapida para que lo veas y que tengas una idea de como se puede hacer, en el codigo css que te pase yo, hay muchas cosas que se repiten y convendria colocar un class en vez de un id, pero como lo hice muy rapido busque la manera mas efectiva y no la correcta, para que veas que de todos modos funciona, luego es cuestion de que vayas cambiando vos las cosas.

Respecto del contenedor, siempre estoy acostumbrado a colocar todo mi contenido dentro de contenedores, de esa manera puedo ubicar los elementos mas facilmente y no corro el riesgo de que se salgan del documento al cambiar las resoluciones.

Un id no es lo mismo que un class, el id es unico y se utiliza solo una vez dentro del documento, en cambio el class lom puedes reutilizar en varios partes de tu documento, por ejemplo si queres que un div tenga una unica propiedad y que no se repita le colocas un id, pero si quieres que todos los divs tengas las mismas propiedades, por ejemplo color y medida, a todos esos divs les colocas un class.-

Te recomiendo que empieces a ver desde cero css, ya que se te va a hacer muy dificil encarar un proyecto hecho en css cuando no sabes diferenciar un id de un class, de todas maneras estoy disponible pára contestar todas tus consultas y si puedo ayudarte mejor.
Saludos.

[TEPO]

Iniciado por azaz

con que mueves las etiquetas para arriba y para abajo?

Eso depende, los divs posicionados en static, los mueves con margin, pero los divs posicionados en absolutos o relativos los puedes mover con coordenadas, o sea con top, left, right, bootom.
ejemplo:

divs posicionados de forma estatica:
margin-left: 20px; (lo moves a la derecha 20px, podes usar margin-top, margin-left - margin-right - margin-bootom y margin).

divs posicionados en forma relativa o absoluta:
top: 20px; (Lo moves 20px hacia abajo, podes usar top, left, right, bootom.)

Espero que te sirva algo de esto. Cualquier cosa preguntas, pero me parece que te serviria mas un tutorial o un buen libro, te dejo un enlace donde podes descargar libros de css, muy buenos:
http://librosweb.es/
De ultima manda un jpg de lo queres hacer y lo vamos viendo por partes.
Saludos.

[azaz]

gracias por tu ayuda pero segun lo que dices ya que mi titulo y comentario se mueve creo que es un div en forma relativa me lo miro y te dire algo gracias por todo un saludo