dernier problème informatique!!

Date d'inscription: 25/06/2011

Voilà, il me reste un tout dernier soucis: La mise en page de la page d'accueil de mon forum.

J'aimerais quelques choses avec onglets, mais je ne sais pas comment faire, et j'ai besoin d'aide pour les tableaux (j'ai les bases, mais je n'y arrive pas toute seule.)

Je n'ai pas envie de quelque chose tout cuit, mais quelque chose expliqué, que je puisse refaire et modifier moi même ^^

Merci d'avance.

Voilà la mise en page de mes onglets+ contenu:

onglet 1 "accueil":

Spoiler:

onglet 2 "quêtes":

Spoiler:

onglet 3 "spécificités":

Spoiler:

onglet 4 "autres":

Spoiler:

Merci d'avance! ^^

Coucou

Et si tu essayais de suivre ce tutoriel [clic] ?

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

j'ai déjà essayé avec ce tutoriel, je n'y arrive pas, il ne remplit pas toute la page de La PA ^^""... Et j'ai aussi un problème avec les tableaux....
Et ce tuto mêle code et graphisme, je n'emmêle les pinceaux!!!

édit: J'ai essayé avec le tutoriel, je n'y arrive pas.... En plus, je n'arrive pas à coder ce que je veux mettre dedans ... (tableaux, sujets qui vont dedans.. etc.) Le tutoriel ne me permet pas de résoudre ce problème... Et je n'arrive toujours pas à ce que ça remplisse correctement ma PA.

Coucou

Je déplace dans les aides spécifiques ^^ On va faire ça ensemble Smile

On va commencer par l'onglet "accueil" : tu auras donc un tableau à 2 lignes et 2 colonnes. Tu fais ça ?

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

Code:

<table>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
</table>

<table>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
</table>

J'ai fait tout le contenu de l'onglet 1, je crois que c'est bon.... Enfin pour le tableau...

Pourquoi il y a a 2 tableaux ?

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

un pour "contexte" et l'autre pour "naviguation" et "staff"... ^^'. Ce n'est pas bon? :s

Ok

Par contre, on va vraiment faire onglet par onglet, sinon, on va s'embrouiller....

Donc le tableau de l'onglet accueil

Code:

<table>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
</table>

On va devoir fusionner les 2 cases de la colonne 1. tu sais le faire ? Smile

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

pas du tout.. :s.. Ce n'est pas quelque chose du genre colspan?....

édit: ça donne ça je crois

Code:

<table>
<tr>
<td rowspan"2">texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
<td>texte texte texte</td>
</tr>
</table>

Presque

C'est bien le rowspan, mais du coup, tu as une case en trop dans ta deuxième ligne

Code:

<table>
<tr>
<td rowspan="2">texte texte texte</td>
<td>texte texte texte</td>
</tr>
<tr>
<td>texte texte texte</td>
</tr>
</table>

Maintenant, j'aimerai que tu commences à remplir ce tableau avec tes infos

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

Code:

<table>
<tr>
<td rowspan="2">Résumé du contexte</td>
<td>*les cinq clans
*La foire au questions
*où est-tu
*le plan
*le gestionnaire
*demande de rp</td>
</tr>
<tr>
<td>
<br><br>Les admins:<br><br>Awbee, la voix off<br>Morwen Feuilld'argent<br>Ijumi Tokage

<br><br>Les chefs:<br><br><br>

<a class="infobulle"><img src="http://i28.servimg.com/u/f28/15/48/85/69/10730110.jpg"><span><table width="100px" cellspacing="1" cellpadding="1" border="0"><tr><td><center><img src="http://i28.servimg.com/u/f28/15/48/85/69/25122111.png"><br><div class="p13"><font size="1">Leili sakuraka</font></div><div class="p14"><font size="1">Le petit loup, chef de la Terre ♥</font></div><font size="2"></font><div><font size="2"><a href="http://azclandia.rpg-dynasty.net/profile.forum?mode=viewprofile&u=9"><font color="#288a0b">voir profil</font></a><br><a href="http://azclandia.rpg-dynasty.net/les-fiches-personnages-f17/leili-sakuraka-t34.htm"><font color="#a32a77">Fiche personnage</font></a><br><a href="http://azclandia.rpg-dynasty.net/msg.forum?mode=post&u=9"><font color="#2aa36f">envoyer mp</font></a></font></div></td></tr></table></center></span></a>

<a class="infobulle"><img src="http://i28.servimg.com/u/f28/15/48/85/69/ijumi110.jpg"><span><table width="100px" cellspacing="1" cellpadding="1" border="0"><tr><td><center><img src="http://i28.servimg.com/u/f28/15/48/85/69/iju10.png"><br><div class="p13"><font size="1">Ijumi Tokage</font></div><div class="p14"><font size="1">Le féroce dragon,chef de sang ♣</font></div><font size="2"></font><div><font size="2"><a href="http://azclandia.rpg-dynasty.net/profile.forum?mode=viewprofile&u=3"><font color="#288a0b">voir profil</font></a><br><a href="http://azclandia.rpg-dynasty.net/les-fiches-personnages-f17/ijumi-tokage-t11.htm"><font color="#a32a77">Fiche personnage</font></a><br><a href="http://azclandia.rpg-dynasty.net/msg.forum?mode=post&u=3"><font color="#2aa36f">envoyer mp</font></a></font></div></td></tr></table></center></span></a>

<a class="infobulle"><img src="http://i28.servimg.com/u/f28/15/48/85/69/2-112.jpg"><span><table width="100px" cellspacing="1" cellpadding="1" border="0"><tr><td><center><img src="http://i28.servimg.com/u/f28/15/48/85/69/haha10.png"><br><div class="p13"><font size="1">Vigo Corpus</font></div><div class="p14"><font size="1">Sanguinaire chef de la Griffe ♦</font></div><font size="2"></font><div><font size="2"><a href="http://azclandia.rpg-dynasty.net/profile.forum?mode=viewprofile&u=4"><font color="#288a0b">voir profil</font></a><br><a href="http://azclandia.rpg-dynasty.net/les-fiches-personnages-f17/vigo-corpus-t56.htm"><font color="#a32a77">Fiche personnage</font></a><br><a href="http://azclandia.rpg-dynasty.net/msg.forum?mode=post&u=4"><font color="#2aa36f">envoyer mp</font></a></font></div></td></tr></table></center></span></a>

<a class="infobulle"><img src="http://i28.servimg.com/u/f28/15/48/85/69/tyrand10.jpg"><span><table width="100px" cellspacing="1" cellpadding="1" border="0"><tr><td><center><img src="http://i28.servimg.com/u/f28/15/48/85/69/huuu10.png"><br><div class="p13"><font size="1">Morwen feuilld'argent</font></div><div class="p14"><font size="1">Grande prêtresse de la cité ♠</font></div><font size="2"></font><div><font size="2"><a href="http://azclandia.rpg-dynasty.net/profile.forum?mode=viewprofile&u=1"><font color="#288a0b">voir profil</font></a><br><a href="http://azclandia.rpg-dynasty.net/les-fiches-personnages-f17/morwen-feuild-argent-t10.htm"><font color="#a32a77">Fiche personnage</font></a><br><a href="http://azclandia.rpg-dynasty.net/msg.forum?mode=post&u=1"><font color="#2aa36f">envoyer mp</font></a>
</tr>
</table>

édit:voilà, je pense que j'ai tout résumer..

Ok

Maintenant qu'on a le tableau, on va commencer à préparer l'onglet. Pour cela, on va préparer la partie 'navigation'. ça va être une image ou un lien pour chaque onglet ?

_________________

SoP Story :: 2ème votes éliminatoires

Date d'inscription: 25/06/2011

j'aimerais des onglets dans ce style:

TEXTE TEXTE TEXTE

Code:

<div style="background-color: #B38D71; -moz-border-radius-topleft: 20px; -moz-border-radius-bottomright: 20px; width: 700px; color: #FFFFFF; text-align: center; letter-spacing:1px; text-shadow: 2px 2px 2px #000000; border: 1px solid #45311B">TEXTE TEXTE TEXTE </div>

^^

(c'était peut être pas ça la question x)..)

sinon pour la partie navigation, ce sera des liens sûrement ^^.

Date d'inscription: 25/04/2011

Coucou,

Bon bah vu que Miettes va prendre un peu de recul, je me permets de prendre le relais.

Dans le tuto de Miettes on reprend à la partie 3 et on code la div "navigation" sauf qu'on ne va pas mettre le code de l'image à l'intérieur mais seulement le nom de l'onglet.

Ensuite on donner la forme voulue à l'onglet grâce au css. Tu sais comment ça marche grosso modo?

Date d'inscription: 25/06/2011

ça ne me dérange pas que tu te charges de cela à sa place ^^. (ps: si ce n'est trop indiscret... Qu'entends tu par "recul"? ^^" je ne suis pas aux dernières nouvelles on va dire...)

Et non, je ne sais pas du tout comment ça marche, je ne me suis jamais posé le problème des onglets... Et sinon, la navigation, c'est le changement d'onglet? (qu'il n'y ait pas de quiproquo x)...)

Sinon je n'ai pas tout compris à son tuto <<... Comment faire pour que ce soit comme ma div (citée un peu plus haut)?

édit: La div sera faite grâce au css non? ^^'... Donc, il n'y a que à faire un effet "caps" lorsque l'onglet est survolé? je pense que je suis capable de le coder grâce au css ^^'. Sinon, pour le reste, je n'ai pas tout tout compris. En fait, juste la class navigation, le reste c'est bon.