Le Deal du moment :
Google Pixel 7 5G – Smartphone 6,3″ OLED ...
Voir le deal
316 €

Question pour la modification d'un codage

Question pour la modification d'un codage Empty Dim 4 Juin - 21:57
Bonjour,

À défaut de pouvoir poster dans la partie appropriée, je le fais ici. J'aurais juste une petite question pour la modification d'un des très beaux codages (Page d'accueil) que vous avez composé, ce dont je vous remercie beaucoup. Voici la version du code adaptée pour mon forum :

Code:
<!--    PAGE D'ACCUEIL    --><div class="FLUII"><div class="boxFLU"><!--    STAFF - IMAGES EN 125*75    --><div class="staffIIFLU"><!--    I    --> <div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/minial13.png" /><!--    CONTENU    --><p></p><p><strong style="color:#AFC3DE">Loralei Rhyne</strong><br />Administratrice<br /><strong style="color:lightgreen;">Disponible</strong><br /><a href="http://starwarsfracturae.forumactif.com/privmsg?mode=post&u=3" target="_blank">MP</a> - <a href="http://starwarsfracturae.forumactif.com/u3" target="_blank">Profil</a></p></div></div><!--    II    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/minial14.png" /><!--    CONTENU    --><p><strong style="color:#FA3232">Lukan Reige</strong><br />Administrateur<br /><strong style="color:lightgreen;">Disponible</strong><br /><a href="http://starwarsfracturae.forumactif.com/privmsg?mode=post&u=6" target="_blank">MP</a> - <a href="http://starwarsfracturae.forumactif.com/u6" target="_blank">Profil</a></p></div></div><!--    III    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniam13.png" /><!--    CONTENU    --><p><strong style="color:lightgrey">Pseudonyme</strong><br />Modérateur<br /><strong style="color:gold;">À pourvoir</strong><br /><a href="" target="_blank">MP</a> - <a href="" target="_blank">Profil</a></p></div></div><!--    IV    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniam13.png" /><!--    CONTENU    --><p><strong style="color:lightgrey">Pseudonyme</strong><br />Modérateur<br /><strong style="color:gold;">À pourvoir</strong><br /><a href="" target="_blank">MP</a> - <a href="" target="_blank">Profil</a></p></div></div></div><!--    EVENEMENT EN COURS    --><div class="eventFLU">   <!--    IMAGE 255*100    --><img src="https://i58.servimg.com/u/f58/17/22/94/78/miniae10.png" /><!--    CONTENU    --><p><!--    TITRE    --><strong>Evénements et News</strong><!--    RESUME    --><span></br>19/11/16 = Création du forum</br>30/05/17 = Lancement de la Bêta de SWF</span><!--    LIENS    --></p></div></div><!--    LIENS & CONTEXTE    --><div class="boxFLU"><!--    6 LIENS    -->   <div class="lksFLU"><!--    I    --><a href="http://starwarsfracturae.forumactif.com/f47-contexte" target="_blank">Contexte</a><!--    II    --><a href="http://starwarsfracturae.forumactif.com/t17-reglement-general" target="_blank">Règlement</a><!--    III    --><a href="http://starwarsfracturae.forumactif.com/f46-registres-formulaires" target="_blank">Registres</a><!--    IV    --><a href="http://starwarsfracturae.forumactif.com/f48-groupes" target="_blank">Groupes</a><!--    V    --><a href="http://starwarsfracturae.forumactif.com/f23-holonews" target="_blank">Holonews</a><!--    VI    --><a href="http://starwarsfracturae.forumactif.com/t57-formulaire-de-demande-de-partenariat" target="_blank">Partenariat</a></div><!--    CONTEXTE    --><div class="ctxtIIFLU" <p><center><strong>Contexte</strong></center></br> Et si la Galaxie que vous avez toujours connue venait à disparaître ? Oh, les mondes sont toujours là, pour une majorité d’entre eux mais après mille éclats, la lumière a fini par s’éteindre : les voies hyperspatiales, garantes de déplacements faciles d’un bout à l’autre de la Galaxie, ne sont plus qu’un lointain souvenir. Aujourd’hui, l’espace est devenu beaucoup plus dangereux à parcourir, et seuls des navigateurs sensibles à la Force peuvent mener les vaisseaux dans l’hyperespace dans une relative sécurité.<br /><br />Pourtant, Jedi et Sith sont éteints depuis des siècles. La Force a perdu ses pôles contraires mais son flux n’est pas tari pour autant. Sans philosophie élaborée, des individus sensibles à la Force se forment par tutorat auprès d’un navigateur voire, pour les plus chanceux d’entre eux, auprès des Hypernautes capables de parcourir toute la Galaxie. Ils incarnent l’espoir dans cette ère d’incertitude, qu’ils cultivent le côté lumineux ou le côté obscur.<br /><br />Si tant de peuples et de civilisations ont dépéri, certaines ont survécu et se sont reconstruites ! Impériaux, Corelliens, Mandaloriens… mais aussi l’Alliance Galactique, devenue Celestopolis  sous l’égide d’intelligences artificielles qui rythment la vie de leurs citoyens, ou encore Hapès, renommée Halios après le renversement par les hommes du matriarcat autrefois dominant.<br /><br />  Mille ans ont passé depuis la Bataille de Yavin et les noms de ses héros sont depuis longtemps devenus des légendes. Place à une nouvelle génération de femmes et d’hommes exceptionnels, soucieux de vivre et de survivre dans cet univers périlleux et changeant, cette galaxie fracturée où ils sont nés. <br /><br />Que la Force soit avec eux !</small></div></div><!--    PREDEFINIS & NOUVELLES    --><div class="boxFLU"><!--    3 PREDEFINIS EN 60*100    --><div class="pfFLU"><!--    I    --><a href="http://starwarsfracturae.forumactif.com/t58-pv-de-la-corporation-corellienne-7-7" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/xavier10.png" /></a><!--    II    --><a href="http://starwarsfracturae.forumactif.com/t56-pv-de-l-empire-sidien-7-7#102" target="_blank"><img src="https://i58.servimg.com/u/f58/17/22/94/78/pacord10.png" /></a><!--    III    --><a href="http://starwarsfracturae.forumactif.com/t51-pv-de-celestopolis-7-7#79" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/yunaei10.png" /></a><!--    LIEN VERS LE RESTE DES PREDEFINIS    --><span><a href="http://starwarsfracturae.forumactif.com/t54-liste-des-pv-pv-scenarios" target="_blank">Postes Vacants et Scénarios</a></span>
</div><!--    NOUVELLES    --><div class="newsFLU">▬ <strong style="color:#AFC3DE;">Célestopolis : 3</strong> <br />▬ <strong style="color: #1EA155;">Corporation Corellienne : 3</strong> <br />▬<strong style="color:#FA3232;"> Empire Sidien : 2</strong>  <br />▬ <strong style="color:#0D62E0;">Principauté d'Halios : 0</strong> <br />▬ <strong style="color:#20B3AC;">Secteur Mandalorien :  2</strong> <br />▬ <strong style="color:#FF6347;">Lune Noire : 0</strong> <br />▬ <strong style="color:#9885ED;">Hypernautes : 6</strong><br />▬ <strong style="color:#CFCFCF;">Mondes Indépendants : 0</strong></div></div><br /><!--    10 PARTENAIRES EN 50*50    --><div class="partFLU"><!--    I    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a>
<!--    II    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    III    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    IV    --><a href="" target="_blank"><img "="" src"="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a>
<!--    V    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    VI    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a>
<!--    VII    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    VIII    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    IX    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    X    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a></div><!--    TOP-SITES    --><div class="topIIFLU"><!--    TITRE    --><span>Top<br />sites</span><!--    I    --><a href="" target="_blank">1</a><!--    IV    --><a href="" target="_blank">2</a><!--    III    --><a href="" target="_blank">3</a><!--    IV    --><a href="" target="_blank">4</a><!--    V    --><a href="" target="_blank">5</a></div></div>

Dans la partie "groupes" (Célestopolis, etc.), je me demandais s'il était possible de remplacer le codage texte actuel par huit images (60x60) associées à un effet infobulle ou hover pour donner des informations sur le groupe (huit groupes). J'ai essayé de mon côté, mais le mieux que je parviens à obtenir, c'est les huit images qui s'enchaînent verticalement et non horizontalement (comme dans votre code pour les Postes Vacants, le staff et les partenariats/topsites). Est-ce que la manoeuvre est possible, et le cas échéant, auriez-vous des suggestions pour parvenir à un tel effet ?

Je vous remercie par avance pour votre attention et votre temps, et vous souhaite une bonne journée,

SWF
Revenir en haut Aller en bas
Question pour la modification d'un codage Empty Lun 5 Juin - 5:50
Bonjour,

HTML :

Code:
<link href="http://sd-1.archive-host.com/membres/up/211183412958130190/RP/FLU_PA.css" rel="stylesheet" type="text/css"><!--    PAGE D'ACCUEIL    --><div class="FLUII"><div class="boxFLU"><!--    STAFF - IMAGES EN 125*75    --><div class="staffIIFLU"><!--    I    --> <div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/minial13.png" /><!--    CONTENU    --><p></p><p><strong style="color:#AFC3DE">Loralei Rhyne</strong><br />Administratrice<br /><strong style="color:lightgreen;">Disponible</strong><br /><a href="http://starwarsfracturae.forumactif.com/privmsg?mode=post&u=3" target="_blank">MP</a> - <a href="http://starwarsfracturae.forumactif.com/u3" target="_blank">Profil</a></p></div></div><!--    II    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/minial14.png" /><!--    CONTENU    --><p><strong style="color:#FA3232">Lukan Reige</strong><br />Administrateur<br /><strong style="color:lightgreen;">Disponible</strong><br /><a href="http://starwarsfracturae.forumactif.com/privmsg?mode=post&u=6" target="_blank">MP</a> - <a href="http://starwarsfracturae.forumactif.com/u6" target="_blank">Profil</a></p></div></div><!--    III    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniam13.png" /><!--    CONTENU    --><p><strong style="color:lightgrey">Pseudonyme</strong><br />Modérateur<br /><strong style="color:gold;">À pourvoir</strong><br /><a href="" target="_blank">MP</a> - <a href="" target="_blank">Profil</a></p></div></div><!--    IV    --><div><div><!--    IMAGE    --><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniam13.png" /><!--    CONTENU    --><p><strong style="color:lightgrey">Pseudonyme</strong><br />Modérateur<br /><strong style="color:gold;">À pourvoir</strong><br /><a href="" target="_blank">MP</a> - <a href="" target="_blank">Profil</a></p></div></div></div><!--    EVENEMENT EN COURS    --><div class="eventFLU">  <!--    IMAGE 255*100    --><img src="https://i58.servimg.com/u/f58/17/22/94/78/miniae10.png" /><!--    CONTENU    --><p><!--    TITRE    --><strong>Evénements et News</strong><!--    RESUME    --><span></br>19/11/16 = Création du forum</br>30/05/17 = Lancement de la Bêta de SWF</span><!--    LIENS    --></p></div></div><!--    LIENS & CONTEXTE    --><div class="boxFLU"><!--    6 LIENS    -->  <div class="lksFLU"><!--    I    --><a href="http://starwarsfracturae.forumactif.com/f47-contexte" target="_blank">Contexte</a><!--    II    --><a href="http://starwarsfracturae.forumactif.com/t17-reglement-general" target="_blank">Règlement</a><!--    III    --><a href="http://starwarsfracturae.forumactif.com/f46-registres-formulaires" target="_blank">Registres</a><!--    IV    --><a href="http://starwarsfracturae.forumactif.com/f48-groupes" target="_blank">Groupes</a><!--    V    --><a href="http://starwarsfracturae.forumactif.com/f23-holonews" target="_blank">Holonews</a><!--    VI    --><a href="http://starwarsfracturae.forumactif.com/t57-formulaire-de-demande-de-partenariat" target="_blank">Partenariat</a></div><!--    CONTEXTE    --><div class="ctxtIIFLU" <p><center><strong>Contexte</strong></center></br> Et si la Galaxie que vous avez toujours connue venait à disparaître ? Oh, les mondes sont toujours là, pour une majorité d’entre eux mais après mille éclats, la lumière a fini par s’éteindre : les voies hyperspatiales, garantes de déplacements faciles d’un bout à l’autre de la Galaxie, ne sont plus qu’un lointain souvenir. Aujourd’hui, l’espace est devenu beaucoup plus dangereux à parcourir, et seuls des navigateurs sensibles à la Force peuvent mener les vaisseaux dans l’hyperespace dans une relative sécurité.<br /><br />Pourtant, Jedi et Sith sont éteints depuis des siècles. La Force a perdu ses pôles contraires mais son flux n’est pas tari pour autant. Sans philosophie élaborée, des individus sensibles à la Force se forment par tutorat auprès d’un navigateur voire, pour les plus chanceux d’entre eux, auprès des Hypernautes capables de parcourir toute la Galaxie. Ils incarnent l’espoir dans cette ère d’incertitude, qu’ils cultivent le côté lumineux ou le côté obscur.<br /><br />Si tant de peuples et de civilisations ont dépéri, certaines ont survécu et se sont reconstruites ! Impériaux, Corelliens, Mandaloriens… mais aussi l’Alliance Galactique, devenue Celestopolis  sous l’égide d’intelligences artificielles qui rythment la vie de leurs citoyens, ou encore Hapès, renommée Halios après le renversement par les hommes du matriarcat autrefois dominant.<br /><br />  Mille ans ont passé depuis la Bataille de Yavin et les noms de ses héros sont depuis longtemps devenus des légendes. Place à une nouvelle génération de femmes et d’hommes exceptionnels, soucieux de vivre et de survivre dans cet univers périlleux et changeant, cette galaxie fracturée où ils sont nés. <br /><br />Que la Force soit avec eux !</small></div></div><!--    PREDEFINIS & NOUVELLES    --><div class="boxFLU"><!--    3 PREDEFINIS EN 60*100    --><div class="pfFLU"><!--    I    --><a href="http://starwarsfracturae.forumactif.com/t58-pv-de-la-corporation-corellienne-7-7" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/xavier10.png" /></a><!--    II    --><a href="http://starwarsfracturae.forumactif.com/t56-pv-de-l-empire-sidien-7-7#102" target="_blank"><img src="https://i58.servimg.com/u/f58/17/22/94/78/pacord10.png" /></a><!--    III    --><a href="http://starwarsfracturae.forumactif.com/t51-pv-de-celestopolis-7-7#79" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/yunaei10.png" /></a><!--    LIEN VERS LE RESTE DES PREDEFINIS    --><span><a href="http://starwarsfracturae.forumactif.com/t54-liste-des-pv-pv-scenarios" target="_blank">Postes Vacants et Scénarios</a></span></div><!-- GROUPES - IMAGES EN 45*60 --><div class="grpFLUII"><!-- I --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#AFC3DE;">Célestopolis<br/>3</p></div><!-- II --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color: #1EA155;">Corporation Corellienne<br/>3</p></div><!-- III --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#FA3232;">Empire Sidien<br/>2</p></div><!-- IV --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#0D62E0;">Principauté d'Halios<br/>0</p></div><br/><!-- V --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#20B3AC;">Secteur Mandalorien<br/>2</p></div><!-- VI --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#FF6347;">Lune Noire<br/>0</p></div><!-- VII --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#9885ED;">Hypernautes<br/>6</p></div><!-- VIII --><div><!-- IMAGE --><img src="" /><!-- INFORMATIONS --><p style="background:rgba(0,0,0,0.9); color:#CFCFCF;">Mondes Indépendants<br/>0</p></div></div></div><br /><!--    10 PARTENAIRES EN 50*50    --><div class="partFLU"><!--    I    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    II    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    III    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    IV    --><a href="" target="_blank"><img "="" src"="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    V    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    VI    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a>
<!--    VII    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    VIII    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    IX    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a><!--    X    --><a href="" target="_blank"><img src="https://i37.servimg.com/u/f37/17/22/94/78/miniap10.png" /></a></div><!--    TOP-SITES    --><div class="topIIFLU"><!--    TITRE    --><span>Top<br />sites</span><!--    I    --><a href="" target="_blank">1</a><!--    IV    --><a href="" target="_blank">2</a><!--    III    --><a href="" target="_blank">3</a><!--    IV    --><a href="" target="_blank">4</a><!--    V    --><a href="" target="_blank">5</a></div></div>


CSS supplémentaire :
Code:
/* GROUPES PA */
.grpFLUII {
 margin-top:10px; width:190px; height:125px; font-size:12px;
}
.grpFLUII div {
display:inline-block; vertical-align:top;
width:45px; height:60px; text-align:center;
}
.grpFLUII img {
width:45px; height:60px;
}
.grpFLUII div p {
position:absolute; margin-top:-60px; width:45px; height:50px; padding-top:10px;
font-size:8px; opacity:0; transition:opacity 0.65s ease; -webkit-transition:opacity 0.65s ease;
}
.grpFLUII div:hover p {
opacity:1;
}
.grpFLUII div:nth-of-type(2) {margin:0 3px 0 4px;} .grpFLUII div:nth-of-type(3) {margin-right:3px;}
.grpFLUII div:nth-of-type(5) {margin-top:6px;} .grpFLUII div:nth-of-type(6) {margin:6px 3px 0 4px;}
.grpFLUII div:nth-of-type(7) {margin-top:6px; margin-right:3px;} .grpFLUII div:nth-of-type(8) {margin-top:6px;}
Revenir en haut Aller en bas
Question pour la modification d'un codage Empty Mar 6 Juin - 1:10
Un immense merci à vous pour votre réponse rapide, complète et efficace. C'est parfait, pile l'effet que je recherchais !

En vous remerciant encore pour vos codages, votre temps et votre éclairage,

SWF
Revenir en haut Aller en bas
Revenir en haut Aller en bas
Vous ne pouvez pas répondre aux sujets dans ce forum