-
.
Disposizione delle Ultime Discussioni/Messaggi in orizzontale
Guida per disporre in orizzontale le ultime discussioni ed il numero di messaggi in orizzontale
Installazione
L'installazione del codice è molto semplice, basterà inserire in Colori e stili in un punto a vostra scelta:CODICE/* ULTIME RISPOSTE E NUMERO MESSAGGI/DISCUSSIONI DISPOSTI IN ORIZZONTALE - http://ffmagazine.forumfree.it/?t=62470873 */
.board .link .yy, .board .link .zz, .board .top .zz, .board .where > span, .board .who > span {display: none} .board .top .yy {text-align: left}
.board .big_list > li {position: relative; padding: 10px 0}
.board .big_list .yy, .board .big_list .zz {width: 350px !important}
.board .yy > div, .board .zz > div {display: inline-block; margin-bottom: 15px; font-family: 'Tahoma', Sans-serif; font-size: 12px; color: #849998}
.board .big_list .yy {position: absolute; margin-left: 10px; top: 55%; padding: 2px; background: #E5EEF2; border: 1px solid #BFD5E0; border-radius: 3px; box-shadow: inset 0 1px 0 #F8FBFC, 0 1px 0 #FBFCFD; text-align: center}
.board .yy > div {margin: 0 30px; color: #92AAB7; text-shadow: 0 1px 0 #FFF}
.board .zz {position: relative} .board .zz a {font-weight: bold; color: #30698D} .board .when {font-weight: bold}
.board .where, .board .who a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
.board .where {position: absolute; left: 10px; top: -30%; max-width: 350px}
.board .who a {display: inline-block; line-height: 20px; margin-bottom: -5px; max-width: 150px}
.board .when:before {content: "Scritto il "; font-weight: normal} .board .who:before {content: "da "; padding-left: 5px}
ATTENZIONE: Se nel forum è attivato lo script "Avatar accanto all'ultimo messaggio", il codice CSS da inserire è:SPOILER (clicca per visualizzare)CODICE/* ULTIME RISPOSTE E NUMERO MESSAGGI/DISCUSSIONI DISPOSTI IN ORIZZONTALE CON AVATAR - http://ffmagazine.forumfree.it/?t=62470873 */
.board .link .yy, .board .link .zz, .board .top .zz, .board .where > span, .board .who > span {display: none} .board .top .yy {text-align: left} .board .zz {vertical-align: middle; margin-top: -35px} .board .lastpost-avatar {vertical-align: bottom !important} .board .lastpost-avatar-right {width: auto !important; margin-left: 7px !important}
.board .big_list > li {position: relative; padding: 10px 0}
.board .big_list .yy, .board .big_list .zz {width: 350px !important}
.board .yy > div, .board .lastpost-avatar-right > div {display: inline-block; margin-bottom: 15px; font-family: 'Tahoma', Sans-serif; font-size: 12px; color: #849998} .board .lastpost-avatar-right > div {margin: 0}
.board .big_list .yy {position: absolute; margin-left: 8px; top: 55%; padding: 2px; background: #E5EEF2; border: 1px solid #BFD5E0; border-radius: 3px; box-shadow: inset 0 1px 0 #F8FBFC, 0 1px 0 #FBFCFD; text-align: center}
.board .yy > div {margin: 0 30px; color: #92AAB7; text-shadow: 0 1px 0 #FFF}
.board .zz, .board .lastpost-avatar-right {position: relative} .board .zz a {font-weight: bold; color: #30698D} .board .when {font-weight: bold}
.board .where, .board .who a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis}
.board .where {position: absolute; left: 0; top: -80%; max-width: 320px}
.board .who a {display: inline-block; line-height: 20px; margin-bottom: -5px; max-width: 130px}
.board .when:before {content: "Scritto il "; font-weight: normal} .board .who:before {content: "da "; padding-left: 5px}
.board .zz > .when {margin-top:7%}
.board .zz > .where {top:30%;left:auto;}
.board .zz > .who {display:none;}
Di seguito, la lista delle modifiche possibili..board .big_list .yy, .board .big_list .zz {width: 350px !important}Consente di impostare la larghezza del riquadro delle ultime discussioni.board .yy > div, .board .zz > div {display: inline-block; margin-bottom: 15px; font-family: 'Tahoma', Sans-serif; font-size: 12px; color: #849998}Consente di personalizzare lo stile del testo. NON toccare display: inline-block; margin-bottom: 15px..board .big_list .yy {position: absolute; margin-left: 10px; top: 55%; padding: 2px; background: #E5EEF2; border: 1px solid #BFD5E0; border-radius: 3px; box-shadow: inset 0 1px 0 #F8FBFC, 0 1px 0 #FBFCFD; text-align: center}Consente di personalizzare lo stile del riquadro del numero discussioni/messaggi. NON toccare position: absolute; margin-left: 10px; top: 55%.board .yy > div {margin: 0 30px; color: #92AAB7; text-shadow: 0 1px 0 #FFF}Consente di personalizzare lo stile del testo del numero discussioni/messaggi..board .zz a {font-weight: bold; color: #30698D}Consente di personalizzare lo stile dei link..board .where {position: absolute; left: 10px; top: -30%; max-width: 350px}L'unico parametro da modificare è max-width: 350px, il cui valore deve corrispondere con quello inserito in .board .big_list .yy, .board .big_list .zz {width: 350px !important}.board .who a {display: inline-block; line-height: 20px; margin-bottom: -5px; max-width: 150px}Anche qui, l'unico parametro da modificare è max-width: 150px. Consiglio di settarlo sempre uguale al max-width di cui al punto precedente, ma diminuito di 200px.
InformazioniIl codice è compatibile solamente con il NUOVO LAYOUT
Questo codice non riscontra alcun problema di visualizzazione, e risulta compatibile con tutti i browser.
11/08/12: Fix del problema con le sezioni contenenti la classe .link
24/10/12: Adesso il blocco avrà sempre la stessa dimensione, a prescindere dalla lunghezza delle scritte al suo interno. Inoltre, sono stati introdotti dei commenti per facilitare la modifica degli stili.
19/02/13: Riscritto totalmente il CSS con una versione più compatta e di più facile personalizzazione.
19/06/13: Ottimizzato il codice nel caso sia attivo lo script Avatar accanto all'ultimo messaggio.
Credits
Il ForumFree Magazine non pretende crediti obbligatori con link e banner da inserirsi sul vostro forum. Tuttavia, dal momento che si tratta di un codice innovativo che ha richiesto tempo per la realizzazione, chiunque volesse inserirli può trovarli qui di seguito (è fatto invece severo divieto di rimuovere i crediti presenti nel codice):HTML<b><a href="http://ffmagazine.forumfree.it/?t=62470873">Ultime risposte e numero messaggi/discussioni disposti in orizzontale</a> realizzato da <a href="http://ffmagazine.forumfree.it/?act=Profile&MID=1879969">El Gringo 89</a> per <a href="http://ffmagazine.forumfree.it/">Forumfree Magazine</a> </b>
Rilasciato sotto <a href="http://creativecommons.org/licenses/by-nc-nd/3.0/">Licenza Creative Commons 3.0</a>
E' possibile, come indicato nei termini di utilizzo, ridistribuire questa guida sui vostri forum lasciandone inalterati integrità e contenuti/crediti ed inserendo il seguente codice in fondo al messaggio:CODICE<div class="textinput" style="margin:1px;padding:4px;display:block;text-align:center"><a title="Ultime risposte e numero messaggi/discussioni disposti in orizzontale" href="http://ffmagazine.forumfree.it/?t=62470873"><b>Ultime risposte e numero messaggi/discussioni disposti in orizzontale</b></a>
Realizzata da <a href="http://ffmagazine.forumfree.it/?act=Profile&MID=1879969">El Gringo 89</a> del <a title="Forumfree Magazine - Stai al passo con Forumfree!" href="http://ffmagazine.forumfree.it/"><b>ForumFree Magazine</b></a>.
Guida rilasciata sotto una <a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/3.0/">Licenza Creative Commons 3.0</a>.</div>Ultime risposte e numero messaggi/discussioni disposti in orizzontale
Realizzata da El Gringo 89 del ForumFree Magazine.
Guida rilasciata sotto una Licenza Creative Commons 3.0.
Edited by Paralizer - 17/12/2017, 23:48. -
.
Grande Lati *>* . -
.
Molto carino *3*
. -
.
lati... SEI UN FIGO! . -
CoolDrift'.
User deleted
Ottimo lavoro =) . -
Kaito.
User deleted
yay, grazie _Lati_! . -
TurboJuly.
User deleted
Ottimo lavoro! . -
• o p e r a •.
User deleted
Grande _Lati_ sei il migliore! . -
kevin nash™.
User deleted
ben fatto lati . -
Z e k.
User deleted
bel codice, complimenti . -
.
Strano che è stato pubblicato ora con la skin attuale, di solito qualche script speciale applicato alla skin veniva pubblicato alla skin successiva
Comunque ottimo, anche se era intuibile dalla sorgente pagina. -
.CITAZIONEComunque ottimo, anche se era intuibile dalla sorgente pagina
La differenza è che ora se lo avete e creditate non vi mastichiamo le caviglie per utilizzo indebito di script :E. -
Christine`.
User deleted
Bellissima idea :3 Grazie mille. . -
.
Il Gaming&Oc. lo usa da tempo, glielo avete permesso voi? XD . -
.
E' il classico esempio di forum a cui sto per mordere le caviglie .