[CSS3]+[HTML] Incarceramento Tooltip dentro timeline

[cristianbelliprojects]

Salve a tutti.
Ho provato a cercare nel forum se ci fossero problemi simili ma non sono riuscito a trovare molto, almeno che faccia al caso mio.
In pratica ho creato una timeline dove ad ogni anno corrisponde un evento, cliccando sull'evento si allarga il container scoprendo il contenuto nascosto. Al suo interno, per migliorarne la navigazione ho evidenziato delle parole con i tooltip inserendo come contenuti, delle integrazioni al testo di riferimento.
Succede che questi tooltip, quando si trovano all'estremo del container (a destra e in basso) questi vengono letteralmente tagliati facendo in modo di rendere poco fruibile il testo al suo interno.

Allego il link della pagina di prova che ho creato per capire meglio il problema. Magari qualche utente più esperto potrà indirizzarmi sulla soluzione o quanto meno risolvere questo dilemma.

http://cristianbelliprojects.altervi...016-05-19.html

Forse un problema di z-index o altro?

[karl94]

Nella pagina che hai indicato non noto i problemi che descrivi, puoi modificare la pagina o indicare i passaggi necessari per riprodurre il problema?

[cristianbelliprojects]

Grazie Karl94 per il tuo intervento.

In pratica, dovresti cliccare sul titolo "Lorem ipsum dolor sit amet, consectetuer adipiscing" ==> scorrere fino al tooltip "Sacutims anamuls".
Dovrebbe vedersi la "nuvoletta" mozzata. Stessa cosa con le note posizionate nell'estrema destra della timeline.

Spero si riesca a vedere o in caso ti mando il codice. Dimmi tu!

[karl94]

È tagliato perché hai specificato overflow: hidden per .content p, dovresti specificarlo piuttosto per .radio:not(:checked) ~ .content.
Ad ogni modo il posizionamento con il CSS non sarà mai ottimale: anche usando max-width anziché width per .tooltip:hover span il risultato non è il massimo.

[cristianbelliprojects]

Grazie Karl 94 per la risposta.

Mi pare di capire che anche intervenendo sul CSS non risolverei del tutto il problema giusto?

La prima versione prevedeva una finestra modale e in quella maniera risolvevo il problema di posizionamento del tooltip, purtroppo a discapito dell'animazione di apertura della timeline...

Esiste qualche alternativa che lo renda più fruibile mantenendo comunque l'animazione timeline?

[karl94]

Probabilmente l'unico modo è usare un po' di JavaScript.