Foros del Web » Creando para Internet » CSS »

situar etiquetas debajo de fotografias

Estas en el tema de situar etiquetas debajo de fotografias en el foro de CSS en Foros del Web. Querría dar un título a las 4 fotografías que vienen a continuación debajo de cada una de ellas. Pero necesitaría saber la forma para que ...
  #1 (permalink)  
Antiguo 25/06/2009, 09:01
 
Fecha de Ingreso: septiembre-2008
Mensajes: 185
Antigüedad: 9 años, 2 meses
Puntos: 1
situar etiquetas debajo de fotografias

Querría dar un título a las 4 fotografías que vienen a continuación debajo de cada una de ellas. Pero necesitaría saber la forma para que estas etiquetas
se mantengan debajo y no se desplacen hacia otra orientación.

El dominio es www.ippcv.org



<div id="mainContent">
<img src="../imagenes/freud-aka.jpg" alt="freud" width="120" height="135" class="imagenes_fundadores" />

label

<img src="../imagenes/melanie_klein.jpg" alt="melanie klein" width="120" height="135" class="imagenes_fundadores" />

label

<img src="../imagenes/lacan.jpg" alt="Lacan" width="120" height="135" class="imagenes_fundadores" />

label

<img src="../imagenes/donald_winnicott.jpg" alt="donald winnicott" width="120" height="135" class="imagenes_fundadores" />

label


<blockquote>
<p class="presentacion">La Asociación Instituto de Psicoterapia Psicoanalítica de la Comunidad Valenciana (I.P.P.C.V.) fue creada en Valencia, Octubre de 2008, en respuesta a las inquietudes de un numeroso grupo de psicoterapeutas y otros profesionales por la práctica y el ejercicio profesional de la clínica desde la teoría psicoanalítica. El Instituto de Psicoterapia Psicoanalítica se rige por unos Estatutos registrados y acreditados por la Generalitat Valenciana y se caracteriza tanto por la apertura hacia una red de Asociaciones de Psicoterapia Psicoanalítica a nivel europeo, estatal y autonómico, como por disponer de un amplio abanico de socios: profesionales con un extensa trayectoria de dedicación a la clínica psicoterapéutica psicoanalítica , estudiantes de los últimos curso de carrera y profesionales interesados en el mundo psicoanalítico.</p>
</blockquote>
<p class="presentacion">Los planteamientos y objetivos del IPPCV se extienden a instituciones (Facultades de Medicina, Psicología, Pedagogía, Sociología, etc.) y otros ámbitos de atención pública como salud mental, medios educativos, servicios sociales o servicios de planificación familiar, lugares donde la Psicoterapia Psicoanalítica se va introduciendo y donde está desarrollando vías de comprensión e intervención dinamizadora frente al sufrimiento, los síntomas y la angustia. </p>
<p class="presentacion">Con las actividades que llevamos a cabo (Seminarios, Cursos, Conferencias, etc.), dirigidas unas a profesionales y otras al conjunto de la sociedad y vertebradas en tres Secciones (niños y adolescentes, grupos y adultos) queremos impulsar, en cuanto a la Psicoterapia Psicoanalítica, el conocimiento, la formación y la investigación. La Psicoterapia Psicoanalítica está ligada a un rasgo fundamental que S. Freud marcó al crear el psicoanálisis y que continúa vigente: abrir la senda de la particularidad de cada sujeto, al enfrentarse a las vicisitudes de su existencia, labor en la que el inconsciente y la palabra se dan cita en la transferencia. </p>
<p class="presentacion">La perspectiva psicoterapéutica psicoanalítica ocupa un lugar desde el que escuchar también en cada sujeto los ecos y efectos de fenómenos sociales como la inmigración, la violencia, la afloración de nuevas formas familiares y nuevos vínculos amorosos y sexuales. A pesar de los progresos tecnocientíficos, consideramos que las variadas formas del malestar psíquico actual, en las que predomina la idealización de una felicidad instantánea y adictiva a los objetos, constituyen una apelación a la búsqueda de respuestas creativas desde la Psicoterapia Psicoanalítica.</p>
</div>
<p><br />
<!-- end #mainContent -->
</p>
</p>


CSS

.imagenes_fundadores {
float: left;
clear: left;
margin-right: 20px;
margin-bottom: 35px;
margin-left: 20px;
margin-top:35px;
}
.presentacion {
font-size:13px;
text-align:left;
line-height:20px;
text-indent:20px;
padding-right:4%;
padding-left:25%;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding-top: 30px;


}

.twoColLiqRtHdr #mainContent {
font-size:14px;
; /* el margen izquierdo debe ser igual al margen del encabezado y el pie para lograr una alineación correcta. */
margin-right: 30%;
margin-bottom: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding-right: 2%;
vertical-align: bottom;
display: block;
margin-top: 0;
}
  #2 (permalink)  
Antiguo 25/06/2009, 09:41
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 10 años
Puntos: 68
Respuesta: situar etiquetas debajo de fotografias

Podrías probar con algo así
Código HTML:
<div><img src="imagen.jpg" /></div>
<div><p>Pie</p></div> 
de esta forma tendrás la imagen arriba y el texto debajo
__________________
No diseñes usando tablas.
  #3 (permalink)  
Antiguo 25/06/2009, 11:00
Avatar de juaniquillo
Colaborador
 
Fecha de Ingreso: noviembre-2005
Ubicación: San Juan, Puerto Rico
Mensajes: 5.745
Antigüedad: 12 años
Puntos: 281
Respuesta: situar etiquetas debajo de fotografias

aunque veo que estás dándole un float a las imágenes, osea que no están en su propia columna. Para este caso podrías meter cada foto y etiqueta en un div y entonces darle float a ese div:

Código html:
Ver original
  1. <div class="float">
  2. <img src="imagen.jpg" />
  3. <p>Pie</p>
  4. </div>
__________________
Por fin.. tengo algo parecido a un blog
Y por lo visto ya estoy escribiendo...
  #4 (permalink)  
Antiguo 26/06/2009, 08:54
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: situar etiquetas debajo de fotografias

Hola Jochite.

Según mi opinión, y una vez que ya tienes los contenidos y sabes cómo quieres presentarlos, creo que te convendría pasar tu página a un diseño típico de Encabezado || cuerpo a tres columnas || pie.

Pero si no te es posible, veo dos opciones:
1ª: crear un nuevo contenedor para alojar esas imágenes y el texto descriptivo, con las propiedades que ahora has dado a las imágenes. Si necesitas algún ejemplo, comenta.

2ª: recurrir al "photochop" que conozcas para modificar la imagen incluyendo el texto bajo ellas sin que se descuadre la página. Así también las haces del tamaño que necesitas (ahora son muy grandes (760*1014 px la primera) redimensionadas en el html (img height="135" width="120")
Un ejemplo:


Pero como te decía, es sólo una sugerencia.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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 09:45.