Testo sotto immagini in CSS, come Wikipedia

[Shibu]

Ciao a tutti,
tramite i css e il codice:

margin: 1px 5px 1px 5px;
float: right;
border: 1px solid #cccccc;

sono riuscito a far apparire l'immagine a destra di un testo e fare in modo che l'immagine venga "integrata" nel testo.
Ho notato che B]Wikipedia[/B] sotto le immagini inserisce del testo che viene preso da "title=testo_immagine", ed intorno all'immagine una piccola tabella. Se volete un esempio: http://en.wikipedia.org/wiki/Shibuya
Vorrei chiedervi se mi potete aiutare a fare la stessa cosa di Wikipedia, e cioè il testo sotto l'immagine presto da "title=" e intorno una tabella.
Grazie
Shibu[

[Alberto]

Ho notato che Wikipedia sotto le immagini inserisce del testo che viene preso da "title=testo_immagine

Ho dato un'occhiata al link, a me sembra che il testo sotto le immagini sia solo testo...
Cos'è che vuoi fare di preciso?

[Shibu]

Mi piacerebbe poter inserire con i CSS una tabella intorno all'immagine e sotto un testo.
Vorrei inserire la tabella con i CSS in modo da fare si che il testo scorra intorno, utilizzando il codice:

margin: 1px 5px 1px 5px;
float: right;
border: 1px solid #cccccc;

Vorrei inserirla con i CSS in modo da magari mettere un class nell'immagine e far mettere la tabella intorno all'immagine senza troppi casini.
Esiste un modo per inserire una tabella intorno ad un immagine con i CSS?

[haZe]

Una tabela?! Immagino tu voglia dire un box.

Un <div> fa al tuo scopo.

[Shibu]

In effetti hai ragione, era un box (DIV) ciò che cercavo.
Ma se sotto l'immagine nel box inserisco un testo, come faccio a fare in modo che il testo non diventi più largo dell'immagine ma vada a capo automaticamente? Non voglio impostare i pixel nella dimensione del box perché ho immagini tutte diverse tra loro...è possibile fare in modo di inserire un testo e fare in modo che la larghezza sia esattamente come l'immagine?
Grazie.

[haZe]

Prova a dare un width: auto all'elemento superiore (il div), _dovrebbe_ bastare

[Shibu]

Uffa non funziona.
Io messo nel foglio di stile:
div.test {
float: right;
margin: 1px 1px 1px 1px;
width: auto;
border: 1px solid #cccccc;
}

e poi nel codice della pagina:


<div class="test">


[img]uc2.jpg[/img]
Questa è una prova per vedere se va a capo correttamente e non fa diventare il box gigante anche se l'immagine è piccola </p></div>

Però il box si allarga a dismisura se la frase è lunga.
Mi puoi aiutare perfavore?
Grazie.

[haZe]

A cosa serve il

?

p.s. potrei cercarti direttamente la soluzione testando io stesso, ma sono un po' impegnato e anche di fretta, mi spiace

[awd]

in pratica vuoi una didascalia dell'immagine, ne abbiamo parlato anche qui http://forum.html.it/forum/showthrea...hreadid=849470

Ho affrontato anche io il problema della larghezza che varia col testo e senza settare la dimensione in px non sono riuscito!
potresti creare un sottobox di dimensioni fisse per il testo!
su wikipedia forse va a capo perché c'è quell'elemento float a destra! bisognerebbe guardare il css

[Shibu]

Grazie mille AWD, il post che mi hai segnalato sembra interessante.
Avevo cercato nei vecchi post ma non l'avevo trovato questo post. grazie!
Ora leggo e poi provo a fare qualcosa.