Sujets similaires

Sujet: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 16:24

voilà j'ai commencé à faire un tableau sur mon forum , mais j'aimerais mettre les images de mon staff une à côté de l'autre (ce sont des infobulles aussi )

voici mon code html :

Code:: <div class="opacity"><DIV id=navigation><img src="http://i49.tinypic.com/33eskcx.png">
<UL>
<LI><A href="Lien">votre texte</A>
<LI><A href="Lien">votre texte</A>
<LI><A href="Lien">votre texte</A>
<LI><A href="Lien">votre texte</A></LI></UL></DIV>

<table width="60%">
<tr>
<td style="border-bottom:4px solid #6B8B8F; padding:10px 30px; text-transform:uppercase;">Contexte</td><td style="border-bottom:4px solid #A37A6F; padding:10px 30px; text-transform:uppercase;">Nouveautés & MAJ</td><td style="border-bottom:4px solid #A37A6F; padding:10px 30px; text-transform:uppercase;">They Miss us</td>
</tr>
<tr>
<td rowspan="2"><justify>Près de deux ans après les évènements passés, la Terre n'était plus ce qu'elle était, le trois quart de la population avait cédé leur esprit à une âme inconnue et une grande guerre avait éclaté. Beaucoup de sang avait coulé, beaucoup de vie avait été sacrifié. Alors que tous rêvaient de trouver une bonne cachette pour survivre, d'autres avaient décidé de se présenter au grand jour. Des créatures que tous pensaient iréelles firent leur apparition, et certaines se lièrent même à l'ennemi. Loup-garou et vampire semblaient avoir choisi le mauvais moment pour sortir de leur tanière. Mais si seulement ce n'était que ça.. Pour une raison inconnue jusqu'à présent, seul la capitale Anglaise ne fut pas touchée par ses âmes envahissantes. Le Gouvernement Anglais bien décidé à ne pas se faire envahir eut érigé un grand mur le long de ses frontières. Les premiers temps, ce mur semblait efficace, mais au fil du temps, des acharnements des âmes, le mur fissurait et se briserait.. Dans ce monde où rien ne va plus, choisir votre camps est sans doute une grande décision. Que vous soyez un simple humain, cherchant la rebellion, ou un vampire, un sorcier ou un chasseur, un loup-garou ou une âme, le chemin du bonheur peut sembler inaccessible..</justify></td><td>----- rien pour le moment, faut patienter!</td><td>TEXTE C</td>
</tr>
<tr>
<td style="border-bottom:4px solid #A37A6F; padding:10px 30px; text-transform:uppercase;">Top affiliates & référencement</td><td style="border-bottom:4px solid #6B8B8F; padding:10px 30px; text-transform:uppercase;">Ended Staff</td>
</tr>
<tr>
<td></td><td>TEXTE D</td><td><center><font color="MediumVioletRed"></font> <a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/></td></tr><tr><td style="text-align: center;"><a class="infobulle"><img src="http://img216.imageshack.us/img216/8783/agreene3.gif"/><BR>
ADMINISTRATRICE</a></td></tr><tr><td style="text-align: center;"><font size="1"><div><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=5" target="_blank">Lui écrire un mp?</a></div></span></a><br/></font></td></tr><tr align="center"/></tbody></table></span></a>
<center><font color="MediumVioletRed"></font> <a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/2q1tjrm.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">A T H É N A H . P A N D O R E</font><br/></td></tr><tr><td style="text-align: center;"><a class="infobulle"><img src="http://i49.tinypic.com/mhexcm.jpg"/><BR>
MODÉRATRICE</a></td></tr><tr><td style="text-align: center;"><font size="1"><div><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=3" target="_blank">Lui écrire un mp?</a></div></span></a><br/></font></td></tr><tr align="center"/></tbody></table></span></a></TD>
</tr></table>

merci d'avance ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 17:07

Je peux avoir ton CSS pour que ça fasse moins désordre sur mon écran ? XD

Par contre en regardant vite fait ton code j'ai vu qu'il n'y avait que 2 balises

Code:: <span>

comme ça
alors qu'il y en a 4 comme ça :

Code:: </span>

Je crois que c'est pas normal :L

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 17:11

Code:: a.infobulle {
position: relative;
}

a.infobulle span {
display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */

}
a.infobulle:hover span {
display: inline; /* ceci affiche l'infobulle */
position: absolute;

white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */

top: 5px; /* on positionne notre infobulle */
left: 15px;

background: #2b2321; /* arrière-plan de l'infobulle */

color: #5d504c; /* texte dans l'infobulle */
padding: 3px;

/* bordures de votre infobulle*/
border: 1px dotted #29211f;
border-left: 1px dotted #29211f;
}

le voilà !
Euh pour les balises span moi je m'y connais pas..
tout ce que je veux c'est apprendre à mettre les images une à côté de l'autre dans mon tableau.. ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 18:08

Hum... je peux tenter de te donner une explication si tu le souhaites ^^

Mais il faudrait que tu me dises exactement les informations que tu veux avoir en "infobulle" car en effet, tout le problème vient des " < span >" et dans ton cas, ça ne semble pas très clair ce que tu souhaites avoir en infobulle ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 18:09

Je laisse le relai à Sheena x)
J'ai tenté plein de trucs mais je n'y arrive pas et j'ai plus de n'oeils pour continuer xD

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 18:21

bon, au pire, je peux déjà te dire ceci ^^

Quand tu poses le

Code:: <a class="infobulle">toutes les informations qui suivent cette balise seront visible. Par contre, quand tu mettras le <span> toutes les informations qui suivent seront dans l'infobulle, il ne faut jamais oublié de fermer les balises </span></a>

Enfin voilà, pour reprendre ton code ^^ (il y a des fautes, il faut y prendre garde d'ailleurs)

Code:: <a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/></td></tr></tbody></table></span></a>

Normalement, si tu rentres ce code, quand ton curseur passera sur l'image apparaitra le nom désiré, dans ce cas-ci Lisa J. Brown ^^ J'espère sincèrement que ça marchera ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 20:04

je veux aussi le gif, puis en dessous ADMINISTRATRICE et en dessous de ce mot l'url de sa boite mp ^^

si possible pourrais-tu me montrer comment mettre deux codes côte à côte et non comme présentement ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mar 19 Jan 2010, 20:10

Code:: <a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/><img src="http://img216.imageshack.us/img216/8783/agreene3.gif"/><BR>
<font size="1">ADMINISTRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=5" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/2q1tjrm.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">A T H É N A H . P A N D O R E</font><br/><img src="http://i49.tinypic.com/mhexcm.jpg"/><BR>
<font size="1">ADMINISTRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=3" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>

Normalement, ça devrait être correcte ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 10:57

UNE VRAIE QUICHE <.< j'ai mis les 4 membres du staff et ça a foiré T.T

Code:: <td><a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/><img src="http://img216.imageshack.us/img216/8783/agreene3.gif"/><BR>
<font size="1">ADMINISTRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=5" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/2q1tjrm.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">A T H É N A H . P A N D O R E</font><br/><img src="http://i49.tinypic.com/mhexcm.jpg"/><BR>
<font size="1">MODÉRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=3" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a></td>
<a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/24ni6ns.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">I R I S J. M A R S H A L L</font><br/><img src="http://s5.tinypic.com/108bacm_th.jpg"/><BR>
<font size="1">CO-FONDATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=2" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a></td>
<a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/x3sf88.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I A M C. M A N C H E S T E R</font><br/><img src="http://i393.photobucket.com/albums/pp14/perfect-tragedy/robertpatt_1.gif"/><BR>
<font size="1">FONDATEUR</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=4" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
</tr></table>

+ Mon forum ICI

P.S :. Je veux deux membres de staff par ligne donc 2x2 et le tout centré

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 12:14

Il te suffisait juste de reprendre le code donné par Sheena au-dessus et de le dupliquer je sais pas ce que tu as fais °°

Code:: <a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/><img src="http://img216.imageshack.us/img216/8783/agreene3.gif"/><BR>
<font size="1">ADMINISTRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=5" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/2q1tjrm.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">A T H É N A H . P A N D O R E</font><br/><img src="http://i49.tinypic.com/mhexcm.jpg"/><BR>
<font size="1">MODÉRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=3" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a><br><a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/24ni6ns.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">I R I S J. M A R S H A L L</font><br/><img src="http://s5.tinypic.com/108bacm_th.jpg"/><BR>
<font size="1">CO-FONDATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=2" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/x3sf88.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I A M C. M A N C H E S T E R/font><br/><img src="http://i393.photobucket.com/albums/pp14/perfect-tragedy/robertpatt_1.gif"/><BR>
<font size="1">FONDATEUR</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=4" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 13:19

OUF MERCIII XD

quand je dis que je suis quiche, c'est la vérité han
mais euh comment on fait pour centrer tout ça?

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 13:25

Code:: <center><a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/5uhe7o.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I S A J. B R O W N</font><br/><img src="http://img216.imageshack.us/img216/8783/agreene3.gif"/><BR>
<font size="1">ADMINISTRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=5" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/2q1tjrm.jpg"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">A T H É N A H . P A N D O R E</font><br/><img src="http://i49.tinypic.com/mhexcm.jpg"/><BR>
<font size="1">MODÉRATRICE</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=3" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a><br><a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/24ni6ns.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">I R I S J. M A R S H A L L</font><br/><img src="http://s5.tinypic.com/108bacm_th.jpg"/><BR>
<font size="1">CO-FONDATRICE</font><br><a href="http://desperatedsouls.forumactif.org/msg.forum?mode=post&u=2" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a>
<a class="infobulle"><font color="burlywood"><img src="http://i48.tinypic.com/x3sf88.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">L I A M C. M A N C H E S T E R/font><br/><img src="http://i393.photobucket.com/albums/pp14/perfect-tragedy/robertpatt_1.gif"/><BR>
<font size="1">FONDATEUR</font><br><a href="http://desperatedsouls.forumactif.org/profile.forum?mode=viewprofile&u=4" target="_blank"><font size="1">Lui écrire un mp?</font></td></tr></tbody></table></span></a></center>

Ça marche ?

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 13:27

Ouiii un énorme merci à toi <3

résolu donc^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 13:30

De rien ^^

Merci aussi à Sheena d'avoir débroussailler ton code xD J'y voyais plus rien hier soir x)

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 13:32

Oui c'est vrai merci à toi aussi Sheena, je suis pas encore habile à détecter les codes invalides moi ^^

Sujet: Re: TABLEAU HELP: infobulle etc.. Mer 20 Jan 2010, 14:05

Bien, je classe donc Smile

Sujet: Re: TABLEAU HELP: infobulle etc.. Jeu 21 Jan 2010, 10:21

Je vais remettre le sujet sur le tapis pour une dernière fois je l'espère xD

j,ai ajouté mes trois pvs sur la PA j,aimerais qu'ils soient côte à côte =)

Code:: <td><center><a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/2lxujup.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">PSEUDO PSEUDO PSEUDO</font><br/><img src="http://img64.imageshack.us/img64/373/clemencee.gif"/><BR>
<font size="1">SORCIÈRE</font><br><a href="URL DU PV" target="_blank"><font size="1">Voir?</font></td></tr></tbody></table></span></a><br/>
<a class="infobulle"><font color="burlywood"><img src="http://i49.tinypic.com/qr0v0m.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">PSEUDO PSEUDO PSEUDO</font><br/><img src="http://i50.tinypic.com/vpcgmw.gif"/><BR>
<font size="1">Werewolf</font><br><a href="url du profil presentation" target="_blank"><font size="1">Voir?</font></td></tr></tbody></table></span></a><br><a class="infobulle"><font color="burlywood"><img src="http://i50.tinypic.com/fk2jqq.png"/></font><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">PSEUDO PSEUDO PSEUDO</font><br/><img src="http://i393.photobucket.com/albums/pp14/perfect-tragedy/benbarnes_2.gif"/><BR>
<font size="1">GROUPE DU PV</font><br><a href="url du pv" target="_blank"><font size="1">Voir?</font></td></tr></tbody></table></span></a>
</center></td>

merciii!

Sujet: Re: TABLEAU HELP: infobulle etc.. Jeu 21 Jan 2010, 14:41

Je vais essayer de t'expliquer clairement.

1- Si on garde ta PA telle qu'elle est, on ne peut pas les mettre côte à côte car les images sont trop grandes et la cellule est trop petite par rapport à elles. Tu vois bien que ça ne pourrait pas rentrer ^^ Il faut donc agrandit ta cellule en rajoutant dans ta balise

Code:: <td>

la valeur :

Code:: width="XXpx"

2- A la base, dans ton tableau tu as mis

Code:: <table width="60%">

Donc si tu mets par exemple 30% pour tes persos prédef' il faut savoir que les deux autres cellules à côté Contexte et Nouveautés & MAJ vont se "partager" les pixels restants. Donc elles vont changer de tailles également.

J'ai testé et pour que les 3 images rentrent il faut mettre dans les 35%. Après si tu veux par exemple en mettre une 4ème il faudra encore agrandir ce nombre.

Ensuite comme conseil, si tu trouves que du coup les autres cellules sont trop "aplaties" il faut changer le nombre de pixels que tu as mis pour ton tableau c'est à dire le

Code:: <table width="60%">

pour qu'il devienne un peu plus grand.

Sujet: Re: TABLEAU HELP: infobulle etc.. Jeu 21 Jan 2010, 15:14

parfaiit merci c'est bon j'ai enfin compris I love you

Sujet: Re: TABLEAU HELP: infobulle etc.. Jeu 21 Jan 2010, 16:27

Avec plaisir ^^
Ah et si elles sont toujours pas alignées c'est qu'il y a des balises

Code:: <br>

en trop il me semble. N'hésite pas à demander =)

TABLEAU HELP: infobulle etc..

TABLEAU HELP: infobulle etc..

Sujets similaires

Sujets similaires

Partenaires Or