Se mueven los divs del interior de otro div al asignarle a este ultimo un margen

[tirengarfio]

Hola,

tengo el siguiente codigo:

Código:

<div id="foto_y_nombre">

    <div id="foto">

    <img alt="" src="uploads/fotografias_miembros/luis.jpg"/>

    </div>

    <div id="nombre">
    
    Ana Asenjo Merino 

    </div>

</div>

Al asignarle un "margin-top" al div "foto_y_nombre", inesperadamente (al menos para mi) el div "nombre" se separa del div "foto".

¿Por que ocurre esto? Yo lo encuentro un poco raro..

¿Como puedo hacer para que nombre y foto no se separen?

Un saludo a tod@s

Javi

[shugert]

puedes pegar el codigo css? o si le asignas un margin-top 0 a los otros dos divs, lo intentaste?

[jomaruro]

Hola:

¿A que te refieres con que se separen?
¿Cómo los quieres que queden?

Saludos.

[Willy_N]

Deberías empezar por el código html,

Lo que tu haces no es correcto, usa simplemente

Código HTML:

<div id="foto_y_nombre">
 
    <img alt="" src="uploads/fotografias_miembros/luis.jpg"/>
 
    <p>
    Ana Asenjo Merino 
    </p>
 
</div>
 

[bkolores]

si bien lo correcto es como dice Willy pero creo que para algunos casos es necesario hacerlo en divs distintos (sino no creo que lo haya hecho junto)

bien lee ...

si el cuadro contenedor tiene un ancho de 800px y cada cuadro mide 400px obviamente si le aplicas border se va a descuadras... ahora si aplicas la opcion border por defecto (al menos en mi caso personal) incluye la opcion "margin" y genera un margin estandar... entonces si creas border: 1px solid; debes también crear margin:0;

salutes.