immagini inline e testo sotto

[gabar-el]

ciao, ho 3 immagini inline e vorrei mettere sotto ognuna un titolo, come cavolo si fa?

<div class="unico">
	<img />
	<img />
	<img />
</div>

css:
.unico {
	margin-top: 25px;
	width: 780px;
	text-align: center;
	clear: both;
}
.unico img {
	margin: 3px;
	padding: 0;
	display: inline;
	float: left;
	border: 1px solid #000;
}

grazie

[Mich_]

Come dire che hai:
- un contenitore di tutto (che hai chiamato "unico")
- tre blocchi affiancati (quindi con float) ciascuno contenente:
- - una immagine
- - del testo sotto di essa

Ti basta come spunto per proseguire da solo?

[gabar-el]

mi stai dicendo di provare con
? ho provato ma il testo viene sparato sopra un'altra immagine... mi sa che il tuo spunto è buono, ma io non riesco a capire. il contesto circa i blocchi float con immagini e testo è netto (cioè l'ho capito perchè me lo hai fatto capire), ma non riesco proprio a comprendere come sfruttare la cosa...
thank's

[salasir]

Pensi ad un risultato simile a questo?

http://www.maxdesign.com.au/presenta...ge-gallery.htm

[gabar-el]

si, l'idea era quella, ma speravo di riuscire col codice che ho già scritto, cmq grazie del link.

[Mich_]

Originariamente inviato da gabar-el
mi stai dicendo di provare con
? ho provato ma il testo viene sparato sopra un'altra immagine... mi sa che il tuo spunto è buono, ma io non riesco a capire. il contesto circa i blocchi float con immagini e testo è netto (cioè l'ho capito perchè me lo hai fatto capire), ma non riesco proprio a comprendere come sfruttare la cosa...
thank's

Ma perche` non cerchi di far funzionare la testa, prima del forum?
Se ti ci metti, poi le soluzioni le trovi da solo .... (basta vedere le tue numerose richieste).

Si puo` fare con le liste di definizione, come suggerito in quel sito (e probabilmente e` la soluzione piu` corretta dal punto di vista semantico).
Io comunque pensavo a qualcosa di piu` semplice, con dei semplici <div>.
Il problema e` comunque lo stesso: per affiancare degli oggetti, tali oggetti devono essere definiti.
Nel tuo caso glioggetti da affiancare sono costituiti da:
- una immagine
- un testo
Quindi per prima cosa devi racchiudere l'immagine e il testo relativo dentro un blocco, che poi puoi posizionare tramite il float.
Quindi il codice HTML deve diventare:

<div class="unico">
  <div><img 1... />

testo1</p></div>
  <div><img 2... />

testo2</p></div>
  <div><img 3... />

testo3</p></div>
</div>

Poi:
- i vari "figlio" dovranno avere il float
- le singole immagini dovranno diventare blocchi
- occorrera` formattare anche i

[gabar-el]

hai ragione! che posso dire? cercherò di far funzionare il cervello. effettivamente mi ero accorto anch'io che posto e poi risolvo, vedrò di starci più dentro....
ho risolto, ero convinto di aver provato anche con il

invece evidentemente me lo sono solo immaginato... con i div e le immagini ho una brutta esperienza, sono impazzito finchè non ho trovato la tua risposta a un post circa il metterle dentro il tag

per far si che abbiano uno "spessore", poi ho trovato altre soluzioni, anche quelle utili. beh, grazie allora!
ciao