[résolu]Une personnalisation difficile

Bonsoir ! Alors j'aimerais personnaliser ce LS ci, enfin c'est un peu compliqué, mais j'ai essayé mais je n'ai pas réussis. Voici donc mon problème

La codeuse de mon forum à refais le LS ici, enfin comme vous le voyez, elle a mit des rubans, et c'est cela que j'aimerais mettre sur mon forum, mais je n'y arrive pas, en effet j'aimerais QUE les rubans, qui sont aussi en infobulles comme vous le voyez, évidement je mettrais dans les crédits un lien vers NU et dire que ça vient d'Haloween, voici quelques images pour mieux expliquer mes propos :

Avant:

Ce que je veux mettre:

Ps, les rubans pourront être fait par la grapheuse, mais c'est le problème de les mettre et tout ça, les templates et tout ça on ne maîtrise pas ça owo

Après:

La résolution de mon pc, désolé, mais voilà en gros ça irait sur le côté comme sur le fofo test

Merci beaucoup d'avance ! Et désolé si c'est pas la bonne section du coup, mais comme c'est un LS voilà :c J'ai accès au forum si vous avez besoin d'une template ou autre !

Coucou :)

Pour récapituler, tu veux fusionner ton QEEL actuel avec celui qui a les rubans ?
Pour qu'on puisse t'aider, il nous faudrait les 2 templates ainsi que le CSS de celui avec les rubans :3

Qu'est ce que tu avais essayé ? Ca avait donné quoi comme résultat ?

Salut ^^ Oui voilà c'est ça ^^

C'est quels templates exactement ? owo Bah j'ai essayé de le mettre moi même mais j'ai pas réussis :c

Css:

Alors, il s'agit du template index_body pour le QEEL :), et il nous en faut 2 : celui du premier forum et celui du second forum

D'accord ^^

Mon forum:

Le forum test:

Up D:

Alors allons-y !

- Dans le template de ton forum, es-tu capable d'identifier à quel endroit se trouve ton QEEL (copier / coller juste cette partie là)
- Dans le template du forum avec les bandeaux, quelle partie du code correspond aux bandeaux que tu veux bouger ?
- Et enfin, sais-tu où dans le CSS se trouve la partie des bandeaux ? :)

N'hésite pas à poser des questions si tu as un doute ou autre

Une fois qu'on aura identifié ces 3 parties là, on ira conquérir l'espace on fera le déplacement de code de telle façon à ce que ça marche bien (^___^)

Yay owo

Mmmh je dirais ça

Spoiler:

Car y a le nom des groupes, mais y a peu être du côté qui y appartient au dessus ou en dessous D:

De même pour les bandeaux

Spoiler:

Et dans le css mh c'est peut être ça avec les trucs marrons écrit owo

Spoiler:

Niquel ! Le QEEL est juste un petit plus grand sur ton forum, en fait c'est toute cette partie là :

Code:

<table class="qeel"><tr><td>
  <div class="titre_qeel">Qui est en ligne ?</div>

  <div class="groupe">
    <a href="http://mastersnekos.forumactif.org/g4-maitres" target="_blank"><span style="color:#D12727;">Maîtres</span></a>
    <a href="http://mastersnekos.forumactif.org/g3-maitresses" target="_blank"><span style="color:#EE7154;">Maîtresses</span></a>
    <a href="http://mastersnekos.forumactif.org/g5-civils" target="_blank"><span style="color:#A261C4;">Civils</span></a>
    <a href="http://mastersnekos.forumactif.org/g11-infectes" target="_blank"><span style="color:#969595;">Infectés</span></a><br>
    <a href="http://mastersnekos.forumactif.org/g7-hybrides-males" target="_blank"><span style="color:#F08F2D;">Hybrides M.</span></a>
    <a href="http://mastersnekos.forumactif.org/g6-hybrides-femelles" target="_blank"><span style="color:#36A31D;">Hybrides F.</span></a>
    <a href="http://mastersnekos.forumactif.org/g8-protecteurs" target="_blank"><span style="color:#D6B900;">Protecteurs</span></a>
    <a href="http://mastersnekos.forumactif.org/g9-oppresseurs" target="_blank"><span style="color:#42A1AD;">Oppresseurs</span></a>
    
  </div>
  <div class="text_qeel">{TOTAL_POSTS}<br />
            {TOTAL_USERS}<br />
            {NEWEST_USER}<br />{TOTAL_USERS_ONLINE}<br />
            {RECORD_USERS}<br />
{LOGGED_IN_USER_LIST}
  
    <table class="whosbirthday" align="center">{L_WHOSBIRTHDAY_TODAY}
            {L_WHOSBIRTHDAY_WEEK}</table></div>

  <div class="droite">

          <table class="connected" align="center">{L_CONNECTED_MEMBERS}</table>
    </div>  
  </td></tr></table>

Toute la partie avec les groupes à remplacer est ici :

Code:

<div class="groupe">
    <a href="http://mastersnekos.forumactif.org/g4-maitres" target="_blank"><span style="color:#D12727;">Maîtres</span></a>
    <a href="http://mastersnekos.forumactif.org/g3-maitresses" target="_blank"><span style="color:#EE7154;">Maîtresses</span></a>
    <a href="http://mastersnekos.forumactif.org/g5-civils" target="_blank"><span style="color:#A261C4;">Civils</span></a>
    <a href="http://mastersnekos.forumactif.org/g11-infectes" target="_blank"><span style="color:#969595;">Infectés</span></a><br>
    <a href="http://mastersnekos.forumactif.org/g7-hybrides-males" target="_blank"><span style="color:#F08F2D;">Hybrides M.</span></a>
    <a href="http://mastersnekos.forumactif.org/g6-hybrides-femelles" target="_blank"><span style="color:#36A31D;">Hybrides F.</span></a>
    <a href="http://mastersnekos.forumactif.org/g8-protecteurs" target="_blank"><span style="color:#D6B900;">Protecteurs</span></a>
    <a href="http://mastersnekos.forumactif.org/g9-oppresseurs" target="_blank"><span style="color:#42A1AD;">Oppresseurs</span></a>
    
  </div>

Et on va mettre à la place les petits bandeaux :

Code:

<div class="bloc3"><br />
<div class="Infobulle"><img src="http://img11.hostingpics.net/pics/782985maitre.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>        
<div class="Infobulle"><img src="http://www.zupimages.net/up/16/03/io6y.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>        
<div class="Infobulle"><img src="http://zupimages.net/up/16/03/oy0t.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>          
 <div class="Infobulle"><img src="http://zupimages.net/up/16/03/y4b8.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>  </div>
<div class="bloc5"><br /> <div class="Infobulle"><img src="http://zupimages.net/up/16/03/86hn.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>
 <div class="Infobulle"><img src="http://zupimages.net/up/16/03/dtco.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>
 <div class="Infobulle"><img src="http://zupimages.net/up/16/03/ebys.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div>      
<div class="Infobulle"><img src="http://zupimages.net/up/16/03/fzzh.png"><div class="Infobulle_contenu">Clematii nec scelere Alexandrini inter nullo per contactus nobilis ad comitem impotentia permissus est scelere inter omnino sibi Clematii humilia letali inter ferebatur introducta cuius letali nobilis amore hiscere oblato amore fines ut nobilis misceri ferebatur iam letali misceri cum per supergressa amore ut Honoratum nobilis per pseudothyrum pretioso ut oblato generum ad inter Clematius loqui scelere mediocrium generum formula ut formula contactus fines occideretur Clematii reginae supergressa loqui nec generum impetraret loqui orientis Clematius ut permissus eius cuiusdam oblato humilia orientis nec comitem formula letali ad reginae nec inter sibi reginae letali Alexandrini Honoratum missa eius cuius scelere generum.</div></div></div>

Ensuite on publie et on valide, normalement c'est hyper moche mais pas d'inquiétude, on va rajouter le CSS !

Le CSS du forum test qui ajoutait les bandeaux est celui ci, ajoute le sur ton forum donc :

Code:

   /* POSITIONNEMENT DES GROUPES */
    .bloc3 {
      position: absolute;
      width: 184px;
      height: 416px;
      right: -166px;
      text-align: center;
  margin-left:20px;
}

    .bloc5 {
      position: absolute;
      width: 184px;
      height: 416px;
      right: 820px;
      text-align: center;
  margin-left:20px;
}

    /* INFOBULLES DES GROUPES */
    .Infobulle {
      position: relative;
      font-size:10px;}
      
    .Infobulle .Infobulle_contenu {
      position : absolute;
      z-index: 1;
      right: -28px;
  top:49px;
      width : 190px;
      height: 80px;
      overflow: auto;
      font-family: arial;
      font-size: 12px;
      background-color: #111111;
      padding: 5px;
      color: #FFFFFF;
      text-align: justify;
      display : none;
    }

    .Infobulle:hover .Infobulle_contenu {
      display : block; /*Fait apparaître l'infobulle*/ }

Ensuite on a juste à ajouter en plus :

Code:

.qeel {
   position: relative; /* pour placer les bandeaux par rapport au QEEL*/
}

Normalement, une fois ça fait, on y preeeesque, il faut juste modifier quelques placements. Comment ? Il faut que tu regardes le CSS de .bloc3 et .bloc5
Je te conseille d'ajouter à chacun cette petite ligne qui permettra de les coller en haut du QEEL :

Code:

top: 0;

Pour .bloc5 je te conseille d'enlever cette ligne :

Code:

 right: 820px;

Et mettre à la place :

Code:

 left: -260px;

Pourquoi ? right: 820px signifie "Place le à 820px de la droite du QEEL". C'est plus simple de lui dire "left: -260px => décale toi de 260px sur la gauche du QEEL" ^^

Hoy ! Je l'ai fais et euuh, ça bug beaucoup ;_; La colonne de droite est plus haute et j'arrive pas a la régler même en bougeant height D: (http://mastersnekos.forumactif.org/)

Tu peux nous dire que ce qui bug s'il te plait ? >-<

Chez moi c'est bon, il reste juste les placements à ajuster :s, quand je regarde j'ai ceci : https://i.imgur.com/r8K8b5v.png

S'il s'agit des placements, voici comment les changer
Si tu veux mettre le bloc de gauche plus à gauche, tu changes la valeur de "left" dans le CSS de .bloc5
Si tu veux mettre le bloc de droite plus à droite, tu changes la valeur de "right" dans le CSS de .bloc3

Si tu veux les baisser, tu regardes sur chacun (sur .bloc3 et sur .bloc5) la valeur de "top". Pour mettre par exemple à la place :

Code:

top: 35px;

Ainsi, ils seront 35px plus bas, après tu ajustes comme tu veux :p

C'est la droite qui est trop haute D: Justement je fais height, mais peut importe ce que je fais ça reste fixe :/

J'ai du mal à comprendre ce que tu veux dire par trop haute, je suis désolée >___<

Elle est positionnée trop haut ?

Si oui, voilà comment il faut changer ça :p

Nihil a écrit:Si tu veux les baisser, tu regardes sur chacun (sur .bloc3 et sur .bloc5) la valeur de "top". Pour mettre par exemple à la place :

Code:

top: 35px;

Ainsi, ils seront 35px plus bas, après tu ajustes comme tu veux :p

Le bloc à droite est .bloc3

Si ce n'est pas le positionnement qui te gène mais la hauteur (plus ou moins grand), tu voudrais qu'il soit comment ? Tu peux nous faire un schéma s'il te plait ?

Ah j'ai réussis en bougeant le top owo Bah en fait y avait un côté plus haut que l'autre du coup c'était pas droit XD Genre la colonne à droite était 10 fois trop au dessus owo Mais j'ai réussis, merci beaucoup ^^

Euh wait, sorry du DP, on peut plus aller sur la cb >< Le bouton "connexion" est pas cliquable oo (la cb est juste en dessous des groupes)

Tu peux me prendre une capture d'écran pour me montrer où est le lien de la CB s'il te plait ? <3

Le premier truc qui me vient à l'esprit c'est d'enlever pour .bloc3 et .bloc5 le "height" dans le CSS ^^

Oui owo

Spoiler:

Mais j'ai enlevé height et ça a l'air de marcher owo

Ouki bon bah ça a l'air tout bon alors ♥︎

Wep merci beaucoup ^^