Salve, poiché il b l o g sul quale vorremmo applicare questo codice -beninteso, una volta funzionante- è pubblico e di tanto in tanto visitato, ne abbiamo creato uno apposito, dedicato unicamente alle sole prove ^-^
Il nuovo indirizzo web è il seguente: prove-e-riprove.blogspot.it/
Grazie ancora per l'attenzione e per l'aiuto che potrete darci, e buona serata 
Salve a tutti,
innanzi tutto spero che questa sia la sezione giusta del forum per postare la mia richiesta 
Essendo alle primissime armi cercherò di spiegare la situazione nel modo più corretto possibile e apprezzerò moltissimo qualsiasi suggerimento dettagliato che possa portare alla soluzione del problema, che è il seguente: io e una mia amica abbiamo aperto un blog su piattaforma Blogger, che utilizza un widget per visualizzare alcune immagini in successione. Avendo la necessità di visualizzare un tooltip particolare per una determinata immagine, è stato inserito del codice CSS trovato in rete e adattato alla bisogna (totalmente assente in origine) che è sì funzionante, ma che lascia il tooltip "imprigionato" nel contenitore, come si vede in questa immagine: app.box.com/s/szr9p5b236nsg2hd96mh
Il codice utilizzato per lo slider è il seguente:
<style type="text/css">
/* CSS TOOLTIP CODE */
/* p.photo_container{width:400px;height:300px;position:relative;margin:25px auto;} */
p.photo_container a{text-decoration:none;color: #0000FF ;cursor:pointer;font-weight:normal;}
p.photo_container a span{visibility:hidden;position:absolute;left:200px;top:70px;
background:#FCABFF;width:300px;border:1px solid #CE53F0;font-size:0.8em;padding:25px 25px;cursor:default;line-height:140%;
border-radius: 10px 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 10px 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 10px 10px rgba(0, 0, 0, 0.1);
font-family: Calibri, Tahoma, Geneva, sans-serif;
text-align: justify;}
p.photo_container a:hover span{visibility:visible;}
/* p.photo_container img{border:1px solid gray;width:400px;height:300px;} */
</style>
<!-- Featured Content Slider Started -->
<div class='fp-slider clearfix'>
<div class='fp-slides-container clearfix'>
<div class='fp-slides'>
<!-- Slide 1 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<!-- CSS TOOLTIP -->
<p class="photo_container">
<a href="example.com" target="_blank"><img src="example.com/img1.jpg" alt="Alt1"/><span>A<br>
<br>very<br>
very<br>
very<br>
long<br>
text
<br></span></a>
</p></div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='example.com'>Link1</a>
</h3>
<p>
Par1
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
<a class='fp-next' href='#fp-next'></a>
<a class='fp-prev' href='#fp-prev'></a>
</div>
</div>
</div>
<!-- Slide 1 Code End -->
<!-- Slide 2 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='example.com' target="_blank"><img title="Title2" src="example.com/img2.jpg"/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='example.com'>Link2</a>
</h3>
<p>
Par2
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
<a class='fp-next' href='#fp-next'></a>
<a class='fp-prev' href='#fp-prev'></a>
</div>
</div>
</div>
<!-- Slide 2 Code End -->
<!-- Slide 3 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='example.com' target="_blank"><img title="Title3" src="example.com/img3.jpg"/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='example.com'>Link3</a>
</h3>
<p>
Par3
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
<a class='fp-next' href='#fp-next'></a>
<a class='fp-prev' href='#fp-prev'></a>
</div>
</div>
</div>
<!-- Slide 3 Code End -->
<!-- Slide 4 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='example.com' target="_blank"><img title="Title4" src="example.com/img4.jpg"/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='example.com'>Link4</a>
</h3>
<p>
Par4
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
<a class='fp-next' href='#fp-next'></a>
<a class='fp-prev' href='#fp-prev'></a>
</div>
</div>
</div>
<!-- Slide 4 Code End -->
<!-- Slide 5 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='example.com' target="_blank"><img title="Title5" src="example.com/img5.jpg"/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='example.com'>Link5</a>
</h3>
<p>
Par5
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
<a class='fp-next' href='#fp-next'></a>
<a class='fp-prev' href='#fp-prev'></a>
</div>
</div>
</div>
<!-- Slide 5 Code End -->
</div>
<div class='fp-nav'>
<span class='fp-pager'/>
</span></div>
</div>
</div>
<div style='clear:both;'/>
<!-- Featured Content Slider End --></div>
mentre a questo link è disponibile quello del template del forum, che ho preferito non postare direttamente perché come potete immaginare è molto lungo: app.box.com/s/j7q7xw0yyv9pqlthcsjc
Cosa si potrebbe fare per visualizzare correttamente il tooltip, e cioè sia sopra l'immagine che al di fuori del contenitore?
L'URL del blog è polvere-di-fantasia.blogspot.it/; in caso servissero altri dettagli fatemi sapere e sarò lieto di fornire tutte le informazioni necessarie
Grazie mille in anticipo per l'attenzione e per l'aiuto che potrete darmi
Ciao a tutti 
Siamo due internauti da oltre un decennio, Luca e Luana
Fino a poco tempo fa io, Luca, ero un semplice fruitore del web con una spiccatissima passione per la fotografia e per le basi -ma proprio basi- di html. Da qualche settimana insieme a Luana, fiabista con una straordinaria creatività, abbiamo aperto un blog, e siccome abbiamo deciso di personalizzarlo un po' e le nozioni in campo HMTL/CSS son appunto minime siam incappati nei primi ostacoli
Proprio per tal ragione abbiam deciso di iscriverci, seppur in maniera sicuramente poco comune eppure innovativa, con un solo account ^-^!!
Confidiamo in questo forum per ampliare le nostre conoscenze in materia e, perché no, poter dare una mano in futuro a chi dovesse incontrar il nostro stesso genere di problemi
A prestissimo sul forum!