Problème de délimitation de tableau

[Nuit Étoilée <3]

Bonjour, bonsoir.

Grâce à l'aide précieuse qu'Isolde m'a fourni en ce qui concerne les tableaux dans le message d'accueil, j'ai put créer quelque chose qui se rassemblait de ce que je voulais. Mais le problème, c'est que tout cela ce met ezn seul blocs, alors que j'aimerais qu'ils soient bien délimité.

Capture de mon forum et du tableau :



les lignes roses fuchia sont celle que j'ai rajoutées sur paint, pour vous montrer comment j'aimerais séparer le contenu.

Moi, j'aimerais vraiment faire des tableaux séparés, un peu dans ce genre (je répéte que je ne veux pas plagier, c'est juste la méthode que j'aimerais)



Je vous ai encadrer en rouges les fameux tableaux.

[Gorgorbey]

Bonjour,

Pouvez-vous fournir le code de ce tableau ?

Cordialement.

[Nuit Étoilée <3]

Oui bien sûr !

Code:

<table width="100%"><tr><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong></td><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> </td><td width="33%" class="titlepa"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong></td></tr><tr><td rowspan="3"><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
</a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br></td><td  rowspan="3"><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td><td><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee>
</td></tr></table>

voilà le mien =)

[Gorgorbey]

Code:

<table width="100%" border="1"><tr><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong></td><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> </td><td width="33%" class="titlepa"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong></td></tr><tr><td rowspan="3"><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
        </a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br></td><td  rowspan="3"><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td><td><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee>
        </td></tr></table>

Cela vous irait ?

[Nuit Étoilée <3]

Oh merci ! C'est vraiment très mignon ♥
Il sont bien délimiter, c'est vraiment bien !
J'aimerais juste savoir si il y a possibilité de les séparer autrement qu'avez vos bandes. S'il est possible d'espacer les tableaux
Merci beaucoup de votre assitance !

[Gorgorbey]

Comme ceci ?

Code:

<table width="100%" border="1" style="border-collapse:collapse;" cellpadding=10><tr ><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong></td><td width="33%" class="titlepa"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> </td><td width="33%" class="titlepa"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong></td></tr><tr><td rowspan="3"><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
        </a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br></td><td  rowspan="3"><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td><td><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee>
        </td></tr></table>

[Nuit Étoilée <3]

Non, pas tout à fait. Voulez vous que je réalise un croquis sur feuille pour vous expliquez plus clairement ?

En tout cas, je trouve ce nouveau code vraiment bien aussi =)

[Gorgorbey]

Oui un petit dessin sera le mieux.

[Nuit Étoilée <3]

Je lance la numérisation.
Veuillez m'excusez du dessin très raté

[Invité]

Bonjour,

Votre première image montre un tableau avec 1 seule ligne et 3 colonnes. Vous avez déja une class qui peut servir en CSS pour ajouter les bordures, il faut juste insérer les contenus en dessous de vos titres avec un saut de ligne <br />. Pour obtenir un espacement entre les cellules on utilise cellspacing.

Code:

<table width="100%" cellspacing="8"><tr><td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong><br /><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
</a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br.></td>

<td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> <br /><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td>

<td width="33%" class="titlepa" valign="top"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong><br /><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee></td>
</tr>
</table>

Et ajoutez dans votre CSS:

Code:

.titlepa{
  padding: 5px;
  border: 2px solid #000;
  text-align: center;
}

Cordialement.

[Nuit Étoilée <3]

Aïe, c'est vraiment très moche.

[Nuit Étoilée <3]

Bonjour,

Votre première image montre un tableau avec 1 seule ligne et 3 colonnes. Vous avez déja une class qui peut servir en CSS pour ajouter les bordures, il faut juste insérer les contenus en dessous de vos titres avec un saut de ligne <br />. Pour obtenir un espacement entre les cellules on utilise cellspacing.

Code:

<table width="100%" cellspacing="8"><tr><td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong><br /><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
</a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br.></td>

<td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> <br /><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td>

<td width="33%" class="titlepa" valign="top"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong><br /><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee></td>
</tr>
</table>

Et ajoutez dans votre CSS:

Code:

.titlepa{
  padding: 5px;
  border: 2px solid #000;
  text-align: center;
}

Cordialement.

Excusez moi, je n'avez pas vu votre message.
Je vais essayer de ce pas!

[Nuit Étoilée <3]

Bonjour,

Votre première image montre un tableau avec 1 seule ligne et 3 colonnes. Vous avez déja une class qui peut servir en CSS pour ajouter les bordures, il faut juste insérer les contenus en dessous de vos titres avec un saut de ligne <br />. Pour obtenir un espacement entre les cellules on utilise cellspacing.

Code:

<table width="100%" cellspacing="8"><tr><td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong><br /><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
</a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br.></td>

<td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> <br /><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td>

<td width="33%" class="titlepa" valign="top"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong><br /><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee></td>
</tr>
</table>

Et ajoutez dans votre CSS:

Code:

.titlepa{
  padding: 5px;
  border: 2px solid #000;
  text-align: center;
}

Cordialement.

Êtes vous sûre ?
Regardez ce que cela donne : http://rpg-aventure-lgdc.forumgratuit.org

[Gorgorbey]

.titlepa{
padding: 5px;
border: 2px solid #000;
text-align: center;
}

Pensez à le mettre dans votre CSS perso
PA > Affichage > Images et couleurs > Couleurs > Onglet Feuille de style CSS

[Nuit Étoilée <3]

Mais le pire c'est que je l'ai mis ... :/



[Mon dessin vous aide vous a t'il a visualiser ma demande ? ]

[Gorgorbey]

J'ai testé la solution de Isolde et cela correspond à votre demande.

Copiez ici le code HTML et l'intégrité de votre CSS perso svp.

[Nuit Étoilée <3]

J'ai testé la solution de Isolde et cela correspond à votre demande.

Copiez ici le code HTML et l'intégrité de votre CSS perso svp.

Je vous promet que j'ai copié la solution d'Isolde et ajouter le code CSS ..

[Invité]

Avez-vous bien validé le code CSS?

Cordialement.

[Nuit Étoilée <3]

Oui ... :/ je vais quand même vérifier.
Maintenant, ça affiche ça :

http://rpg-aventure-lgdc.forumgratuit.org/

[Invité]

Il faut ôter les numéros ( de 1 à 8 ) qui s'affichent dans le code, je pense que le soucis vient de là.

Cordialement.

[Nuit Étoilée <3]

Malheureusement, je ne vois pas de changement, à part le fait que j'ai enlevé les chiffres

[Nuit Étoilée <3]

voilà le contenu de "message sur la page d'accueil"

Code:

<table width="100%" cellspacing="8"><tr><td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>Staff</i></font></strong><br /><a href="http://hapshack.com/images/agrJk.jpg"><img src="http://hapshack.com/images/thumbs/agrJk.jpg" border="0"
</a><br><i><span style="font-size: 12px; line-height: normal"> Étoile de Cristal, Adminette en Chef & Fondaa'</span></i><br.></td>
<td width="33%" class="titlepa" valign="top"> <strong><font color="cyan"><span style="font-size: 13px; line-height: normal"><i>État des Clans</i></span></span></font></strong> <br /><span style="font-size: 17px; line-height: normal"><font face=" Times New Roman">Clan de l'Aurore : <font color="green"><strong> OUVERT <br></strong></font>Clan du Crépuscule :<font color="red"><strong> FERMÉ</span> </strong></font></font><br/></td>
<td width="33%" class="titlepa" valign="top"><font color="cyan"><strong><span style="font-size: 13px; line-height: normal"><i>Patenaires</i></span></font></strong><br /><marquee><a href="http://lgdc-rpg-chatsauvage.forumgratuit.org/" class="postlink" target="_blank" rel="nofollow"><img src="http://nsa22.casimages.com/img/2012/01/01/mini_120101033824370482.jpg" border="0" alt="" /></a><marquee></td></tr></table>

et voilà le contenu de la feuille CSS

Code:

/*Affichage des Titres*/

.forumlink
{
display: block;
height: 30px;
margin-left: 5px;
}


a.forumlink
{
padding-top: 6px;
padding-left: 50px;
background-image: url(http://sd-2.archive-host.com/membres/images/134568121656250658/forumlin.jpg);
background-repeat: no-repeat;
color: #7A8FBA;
font-variant: small-caps;
}


/* QUI EST EN LIGNE */


.toutqeel {
width: 600px;
overlow: hidden;
text-align: left;
}

.qeel {
background-image: url('http://i27.servimg.com/u/f27/11/07/38/09/qeel13.jpg');
width: 600px;
overflow: hidden;
border: solid 1px #000000;
margin-top: -22px;
padding: 10px;
}

.qeelgauche {
width: 250px;
height: 250px;
text-valign: top;
margin-right: 15px;
}

.informations {
width: 250px;
border-left: solid 1px #000000;
border-top: solid 1px #000000;
border-right: none;
border-bottom: none;
margin-top: -2px;
padding: 8px;
font-size: 11px;
text-align: left;
text-valign: top;
}

.connexions {
width: 290px;
height: 200px;
border-left: solid 1px #000000;
border-top: solid 1px #000000;
border-right: none;
border-bottom: none;
margin-top: -2px;
padding: 8px;
font-size: 11px;
text-align: left;
text-valign: top;
}

.tchat {
width: 250px;
border-left: solid 1px #000000;
border-top: solid 1px #000000;
border-right: none;
border-bottom: none;
margin-top: -2px;
padding: 8px;
font-size: 11px;
text-align: left;
text-valign: top;
}

.groupes {
border-left: solid 1px #000000;
border-top: solid 1px #000000;
border-right: none;
border-bottom: none;
margin-top: -3px;
padding: 8px;
font-size: 11px;
font-variant: small-caps;
text-align: left;
text-valign: top;
}
opacity : 0.8;
-moz-opacity : 0.8;
-ms-filter: "alpha(opacity=80)"; 
filter : alpha(opacity=80); 

.titlepa{ 
padding: 5px; 
border: 2px solid #000;  text-align: center;
}

Si ça peut voux aider ...

[Invité]

Dans votre CSS, vous avez tout ceci en dehos d'un paragraphe:

Code:

opacity : 0.8;
-moz-opacity : 0.8;
-ms-filter: "alpha(opacity=80)";
filter : alpha(opacity=80);

Essayez de le supprimer pour voir si ça fonctionne mieux ensuite.

Cordialement.

[Nuit Étoilée <3]

C'est ça !!!

Bien vu

Merci beaucoup Isolde vous êtes une Aidactif en OR

Résolu ! =)

[Nuit Étoilée <3]

Merci à vous aussi Gogorbey

Dernière question (après je me tais tout à fais promis juré)

J'avais prévu (au cas ou je n'arriverais pas à mettre les tableaux) une petite création, qui représente ma PA de rêve, la voilà :



voici le code HTML : <a href="http://hapshack.com/images/aDTg8.png"><img src="http://hapshack.com/images/thumbs/aDTg8.png" border="0" /></a>

Serait t'il possible, de la mettre en taille NORMALE dans le message de la page d'accueil ?

Car là, ça me la met en miniature :/

[Nuit Étoilée <3]

Personne n'a d'idée s'il vous plait ?

[Gorgorbey]

Votre image a la base est minuscule donc si on la force à s'agrandir, on ne verra rien car elle sera pixelisée. Il faut que vous l'hébergiez avec une taille plus grande.

[Nuit Étoilée <3]

Ah bon ?

Ca c'est trop petit ?


http://hapshack.com/?v=aDTg8.png

[Gorgorbey]

<a href="http://hapshack.com/images/aDTg8.png"><img src="http://hapshack.com/images/thumbs/aDTg8.png" border="0" /></a>

Vous mettez dans un lien une image
Si vous voulez juste afficher l'image c'est :

Code:

<img src="http://hapshack.com/images/aDTg8.png" border="0" />

Si l'image est aussi un lien c'est :

Code:

<a href="URL de la page à joindre"><img src="http://hapshack.com/images/thumbs/aDTg8.png" border="0" /></a>

[Nuit Étoilée <3]

Oh merci !!

C'est parfait.

Je ne sais pas comment vous remerciez !!

Encore merci !!