AccueilAccueil  FAQFAQ  RechercherRechercher  S'enregistrerS'enregistrer  MembresMembres  GroupesGroupes  ConnexionConnexion  

Partagez | 
 

 [Terminer] Demande pour une PA

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 13:06

Voila je me tourne vers vous en ce jour, la corde autour du coup, debout sur mon tabouret prête à rendre l'âme.
Je me retrouve devant un soucis: avec mon compagnon nous attendons la sortie de Guild Wars 2 avec une vive impatience. Etant tout deux Guild Master sur d'autre jeu nous souhaitons à nouveau tenir une guilde sur celui ci. Pour ce faire nous travaillons à la construction d'un forum le plus classe possible (nous nous somme inscrit à gauche et à droite pour apprendre à coder par nous même.)
Mais voila division du travail fait entre nous deux je me retrouve avec la PA sur le dos, et pour être franche comme je début en codage CSS/HMTL je n’emmêle les pinceaux et donc la PA est totalement foireuse.

J'aimerais alors "passer commande" au près de vous pour cette maudite PA.

Voila j'aimerais que ça rende comme ceci


Est ce que ma demande est traitable?
Merci beaucoup, bonne journée à vous.

Cordialement Laega


Dernière édition par Laega le Jeu 09 Aoû 2012, 16:09, édité 1 fois
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 13:14

Alors alors, je vais essayer de te faire ça Very Happy
Aurais tu la possibilité de me donner l'image en taille réelle , ou alors la dimension de chaque bloc ?
Je vais essayer de commencer dès maintenant ;)
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 13:18

Voila l'url pour l'image en taille réel
http://img684.imageshack.us/img684/318/exemplepa.png

et voila les 3 petites étiquettes (113*57) du cadre "Maréchal de Guilde" (elles sont à bonne dimension)





Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 14:18

Voilà je crois que c'est à peu près ça, il manque juste la police à ajouter il me semble Smile

Test → ICI

Le code html :
Code:
<div class="pa_div">
<h1>Bienvenue sur le Forum de Cursed Crown</h1>
<table id="pa" width="865" border="0" cellspacing="10" cellpadding="5">
  <tr>
    <td rowspan="3" class="pa_histoire" ><div class="pa_histoire">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc eros nisl, condimentum mollis interdum aliquet, pellentesque ac leo. Sed commodo felis sed nisl laoreet at eleifend purus dictum. In non est quis massa dignissim dignissim. Vestibulum vestibulum dapibus auctor. In elementum gravida risus vitae consequat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam vehicula fringilla libero, id hendrerit diam mollis quis. In vitae purus sem, ut laoreet lorem. Aenean lobortis lorem consequat est dictum rutrum. Quisque erat lorem, mattis at venenatis rhoncus, ullamcorper lacinia erat. Nulla massa nunc, aliquet id aliquam et, venenatis quis velit. Nullam sed enim erat. Nullam a eros sem. Nam faucibus tempus ante, a pretium orci sollicitudin at. Fusce hendrerit lectus non nunc sollicitudin vehicula. Aliquam et mauris sed nisi pretium tristique nec elementum lacus. Quisque erat lorem, mattis at venenatis rhoncus, ullamcorper lacinia erat. Nulla massa nunc, aliquet id aliquam et, venenatis quis velit. Nullam sed enim erat. Nullam a eros sem. Nam faucibus tempus ante, a pretium orci sollicitudin at. Fusce hendrerit lectus non nunc sollicitudin vehicula. Aliquam et mauris sed nisi pretium tristique nec elementum lacus.</div>
    </td>
    <td colspan="2"><h2>Marechal de la Guilde, Grand Maître et Hrank</h2>
    <span class="pa_etiquette"> <img src="http://img528.imageshack.us/img528/5381/griffargenttiquettecont.png" alt="" />
    <br /> <a href="">contact</a></span>
    <span class="pa_etiquette"> <img src="http://img18.imageshack.us/img18/2803/naitotiquettecontact.png" alt="" />
    <br /> <a href="">contact</a></span>
    <span class="pa_etiquette"> <img src="http://img832.imageshack.us/img832/3100/aethratiquettecontact.png" alt="" />
    <br /> <a href="">contact</a></span>
    </td>
    </tr>
  <tr>
    <td rowspan="2" valign="top" class="pa_navig"><div class="pa_navig>"<h2>Navigation</h2>
    <a href="">>Charte</a>
    <a href="">>Bureau de Recrutement</a>
    <a href="">>Contact Hrank</a>
    <a href="">>Panneaux d'affichage</a></div>
    </td>
    <td><h2>New's & Updates</h2>
    >Mise à jour du règlement
    <br />>Organisation pour les Catacombes d'Ascalon</td>
  </tr>
  <tr>
    <td valign="top"><h2>Alliance</h2>
    <span class="pa_guilde">Guilde 01</span><span class="pa_guilde">Guilde 02</span>
    <span class="pa_guilde">Guilde 03</span><span class="pa_guilde">Guilde 04</span> </td>
  </tr>
</table>
</div>

Et le CSS :

Code:
.pa_div{
   background-color:   #E0D9D0;
   width:870px;
   margin:auto;
}

h1{
   text-align:center;
   color:#6B5E4E;
   height:60px;
   line-height:60px;
   margin:0;
}

h2 {
   text-align:center;
   color:#E0D9D0;
   font-size:14px;
   margin:0;
   padding:0 0 10px 0;
}

#pa td{
   background-color:   #6B5E4E;
   color:#E0D9D0;
   -webkit-border-radius: 10px;
   -o-border-radius: 10px;
   border-radius: 10px;
}

.pa_histoire {
   width:330px;
   height:380px;
   overflow:auto;
}

.pa_etiquette {
   display:inline-block;
   margin-left:20px;
}

.pa_etiquette a{
   text-decoration:underline;
   color:#E0D9D0;
}

.pa_navig {
   width:241px;
}

.pa_navig a{
   display:block;
   margin-left:20px;
   color:#E0D9D0;
   text-decoration:none;
}

.pa_guilde {
display:inline-block;
width:110px;
}
</style>

Les bords arrondis ne fonctionneront pas sous Internet Exlorer par contre .. Il aurait fallu le faire avec des images mais c'est carrément plus contraignant :/

J'espère que j'ai pas fait de grosses erreurs dans mon code en tous cas ^^ En espérant que ça marche !
EDIT : Je viens de me rendre compte qu'au niveau des tailles c'est pas exactement identique, je peux toujours re-modifier ça si tu veux ^^
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 14:26

Je t'embrasserais les pieds pour l'écharde que tu viens de m’ôter. Elle est tout simplement magnifique encore mille merci, actuellement je change le texte (forcement) de la case histoire
Voila ce que ça donne sur le fofo:


Merci merci merciiii
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 14:40

Oh, c'est étrange que la barre de défilement n'apparaisse pas pour l'histoire et que le "navigation" ne soit pas centré comme les autres :[

Et ce n'est pas la peine de m'embrasser les pieds x') J'aime beaucoup faire des PA et je n'en fais quasiment jamais sans image de fond, donc ça m'a entrainé à autre chose What a Face
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 14:43

bah il faudrait que j'apprenne à les faire moi-même pour bien faire, mais je n'ai pas encore trouver de "profs" à ce niveau T.T
Pour ce qui est de la navigation j'avais pas tiqué je vais regarder ce qui "bug"
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 15:06

Si tu cherches à faire quelque chose et que tu n'y arrives pas, n'hésite pas à poster un message dans CSS / HTML et je t'expliquerai point par point comment faire.

Et sinon, si tu as un peu de temps pour pas mal de lecture, je te conseille le Site du Zero qui est vraiment un site génial, où tu peux apprendre tout à partir de 0 ( c'est sur ce site que j'ai appris presque tout ce que je connais ^^).

Voilà pour en revenir au sujet principal, le "navigation" est bien entouré de <h2> et </h2> ?
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 15:18

Oui il l'est
Code:
<td rowspan="2" valign="top" class="pa_navig"><div class="pa_navig>"<h2>Navigation</h2>

Voila la ligne tel qu'elle est dans mon panneau d'admin.

Okay je vais passer faire un tour sur ce site.
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 15:40

C'est étrange, quand je suis sur ton forum et que j'observe le code je vois ça :

Code:
<td class="pa_navig" valign="top" rowspan="2">
<div class="pa_navig>" <h2="">
Navigation
<br>
<br>
<a href="http://aetherna.forumpro.fr/f16-charte-de-guilde">>Charte</a>
<a href="http://aetherna.forumpro.fr/f1-bureau-de-recrutement">>Bureau de Recrutement</a>
<a href="http://aetherna.forumpro.fr/privmsg?mode=post&u=1">>Contact Hrank</a>
<a href="http://aetherna.forumpro.fr/c2-hall-de-guilde">>Panneaux d'affichage</a>
<br>
</div>
</td>
et pour le suivant, qui lui est bon
Code:
<td valign="top">
<h2>New's & Updates</h2>
>Mise à jour du règlement
<br>
>Organisation pour les Catacombes d'Ascalon
</td>

Donc pour la navigation ton code ne semble pas être le même quand tu le postes via le panneau d'admin que quand il apparait une fois la page d'accueil ouverte ...

Si il n'y a rien à faire avec ce h2, il te reste toujours une solution un peu plus brouillonne :
Remplace ton <h2> navigation </h2> par <div style="pa_titre_navig">navigation </div>
et ajoute le CSS suivant dans ton panneau d'admin :
Code:
.pa_titre_navig {
  text-align:center;
  color:#E0D9D0;
  font-size:14px;
  margin:0;
  padding:0 0 10px 0;
}

C'est le même style que le h2 en fait. Si avec ça, ça ne fonctionne toujours pas je ne serais plus capable de t'aider :[.
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 15:55

j'ai trouvé il manquait juste la balise "td" dans la ligne juste avant le Navigation

Code:
<td rowspan="2" valign="top" class="pa_navig"><div class="pa_navig>"<td><h2>Navigation</h2>


comme quoi des fois à force d'avoir le nez sur les codes ont ne vois plus les petit truc du genre ^^
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 16:03

Ah o_O ? Je comprends pas trop pourquoi, étant donné que ça ouvre une nouvelle cellule à l'intérieur d'une div et qu'elle n'est plus fermée ... Enfin si ça marche tant mieux x'D

J'avais finalement trouvé la solution :
il y a ça
Code:
<td rowspan="2" valign="top" class="pa_navig"><div class="pa_navig>"<h2>Navigation</h2>

Et il faut ça
Code:
<td rowspan="2" valign="top" class="pa_navig"><div class="pa_navig"><h2>Navigation</h2>
C'était juste le " qui était décalé après le > ^^"
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 16:06

aussi oui, j'avoue ne pas avoir fait attention à ce guillemet perdu.

Apres test, si tu conserve ce "td" solo, et que tu bouge la guillemet, alors oui il crée une nouvelle cellule mais le faite de mettre le guillemet dehors , le td le corrige XD
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 16:11

T'as essayé avec le " au bon endroit et sans le <td> ? ( à vrai dire j'ai beau chercher, je ne comprends pas pourquoi il y a besoin d'un <td> ^^")
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Laega

avatar

Féminin
Nombre de messages : 20
Age : 28
Logiciel de Création : Photoshop
Date d'inscription : 06/08/2012

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 17:39

oui j'ai essayer , et c'est bon.
Pour le td en fait j'avais zapé celui du début de ligne et en le rajoutant ça allait donc XD
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Ella'

avatar

Féminin
Nombre de messages : 4063
Age : 24
Logiciel de Création : Suite Adobe, Sketch, Suite Affinity
Date d'inscription : 19/02/2008

MessageSujet: Re: [Terminer] Demande pour une PA   Jeu 09 Aoû 2012, 18:13

Ok nickel ! Bon, je déplace dans les vieux sujets ;)

Si t'as la moindre question relative à cette commande, soit tu ouvres un nouveau sujet, soit tu m'envois un MP pour que je le re-déplace ici Smile

PS : si tu veux utiliser une police spécifique comme sur ton exemple, tu peux utiliser la propriété @font-face ( je peux te donner ce lien pour plus d'infos) ou le Google web font proposé par Google (explication pour utiliser les polices sur un forum ici).
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Contenu sponsorisé




MessageSujet: Re: [Terminer] Demande pour une PA   

Revenir en haut Aller en bas
 
[Terminer] Demande pour une PA
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Eligibilité: Comment faire une demande pour la fibre?
» Demande pour installer le logo de TP
» Demande pour Mélodie pub
» HELP ! Demande pour récupérer numéros en 09 !!!! SARL en danger
» Demande pour Ultimate.Diamond [Accepté]

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Graphisme Cat-Life ::  :: Vieux Sujets :: Demande de créations-
Sauter vers: