(CaféOlé) Une petite commande de PA simple à prendre ^^

Bonjour!

Pour inaugurer le nouveau graphisme de notre forum, j'aimerai également innover une nouvelle page d’accueil, simple et qui aille avec les tons du graphisme en cours.

Voici donc la commande:

Merci ^^

La police sera du TrebuchetMS en effet j'avais oublié de l'écrire

Petit UP?  

Bonjour Estrée ! Je viens de terminer ma commande en cours, je veux bien prendre la tienne mais je ne veux pas de coup de fouet hein ?  

Je vais tenter de bosser là dessus ce weekend, je reviens vers toi dès que j'ai un aperçu à te fournir !

Okay =) C'est gentil à toi de prendre le temps de m'aider.

Pour les coups de fouets, je ne promets rien, d'après les échos que j'ai eu, ils seraient salvateurs, donc je te laisses choisir XD *n'est plus là*

 Merci à toi de prendre le temps de m'aider. Et bon courage ^^

petit passage éclair par là juste pour te dire que je ne t'oublie pas et que je travaille un peu plus lentement que prévu (me suis pété le poignet, c'est d'un pratique... ^^") mais que j'avance. Je reviens vers toi bientôt

Bonne soirée !

Arf pas cool pour toi >_<' courage!

Prends tout ton temps, nous ne sommes pas à quelques jours/semaines prêts =)'

Merci à toi de me tenir au courant et bon courage pour ce codage de masse! :]

Hop, petit passage par là pour te donner un aperçu de mon travail. J'ai fini le "gros oeuvre" et maintenant j'attaque les petits travaux

Clic

N'hésites pas si tu as des choses à redire sur cette structure, comme ça je peux adapter au fur et à mesure si besoin. J'y retourne ^^

Coucou!

Omgomgomg *3* C'est trop beau merci beaucoup!

Tu parles de petites travaux, mais de quoi parles-tu? c'est très bien comme ça  
Je m'en vais faire voir ton oeuvre dans mon asile de forum, s'il y a quelque chose à ajouter ne t'inquiète pas que je t'en ferais part assez vite =) !

Encore merci pour ce que tu fais =)' !

C'est parce que j'ai retravaillé entre deux x) quand je t'ai mis l'aperçu cet aprem y'avait juste la structure mais j'ai avancé plus vite que je le pensais. On s'habitue à travailler avec un plâtre en fait  

On va voir ce que ça donne sur ton forum de test ! Je t'ai mis quelques infos dans le css pour t'aider à le modifier plus tard à ton goût si besoin.

Le CSS donc




et le HTML :



Il faut parfois adapter d'un forum à l'autre donc si soucis on réglera ensembles ^^

Épouses-moi XD  c'est trop classe merciiiii!!!

Ca marche nikel sur le test graph, je n'ai rien à faire ni a redire =)'

Pourrais-tu juste ajouter dans le tableau " staff" deux carrés supplémentaires S'il te plais? =)
( mettre les trois plus à gauche et ajouter les deux autres séparément plus à droite ? ^^ )

Après ce serait vraiment parfait *.*

D'accord, marions nous tout de suite *_*  

Voilà pour tes deux petites cases, tu peux en ajouter très facilement en ajoutant ceci :

Code:

<div class=logostaff></div>

à la suite des cinq premiers (tout à la fin du HTML) et pareil dans le sens contraire tu peux en enlever de la même façon. Par contre si jamais tu fais ça tu vas voir que le petit titre "staff" se décalera. Il te suffira de jouer avec la valeur "right" dans le CSS pour corriger ça. Augmente le chiffe et ton titre se décalera vers la gauche. Diminue le et il se décalera vers la droite. Cela marche aussi avec la valeur "bottom" si jamais tu veux le monter ou le descendre.

Voici le code avec 2 cases en plus :

HTML


CSS



Si soucis je reste dans le coin ^^

*3*  owiii merci! Beaucoup!
* regarde sa main puis, le prix d'une alliance en vitrine... déglutit *
Hum... On verra ça quand j'aurais ma prime de Noël en 2095, hein :p

Par contre j'ai un petit soucis avec le code en générale, ça manque de scroll-barre...  
( en contexte et en liens utiles. ... De plus le "STAFF" est légèrement trop à gauche =/ )

J'ai essayé pourtant de faire comme j'ai pu et de modifier moi même, mais ça se déformait de partout =/
Désolée de t'embêter un peu plus, mais je suis dans l'incapacité de réaliser une scroll =/ ( et encore moins de reprendre tout ton travail à cause de simples scroll >o<" je risque à nouveau de tout mettre en l'air. )

Désolée et courage, on y voit le bout! >_< c'est presque finit!
* lui apporte le thé et quelques douceurs avant de repartir aussi vite qu'elle était venue *

Bonjour Estrée :Pt'en fait pas pour l'alliance on cambriolera une banque ensembles avant le mariage

Bizarre, les barres de défilement fonctionnement sur mon forum test... aperçu

Bon le Staff je me doutais qu'on allait devoir adapter un peu (je l'ai mis en positionnement relatif et comme la PA s'adapte à la largeur de ton forum ben ce positionnement n'est plus le bon, pas grave on va changer ça très facilement)

Est-ce que tu préfères me redonner le code avec tes modifications pour que je corrige ou est-ce que je te redonne un code complet avec le staff un peu plus à droite et les5 cases staff ? Les deux idées me conviennent hein, ça doit pas être grand chose ça va pas me prendre longtemps t'inquiète pas ^^

Cambrioler une banque.... *...* owiii comme ça on aura tout plein de PO pour aller se faire un voyage autours du monde tout en nageant dans un navire couvert d'or et de pierres précieuses ... mwhahahaha  !  

Hum... je vois, ton code marche très bien sur ton forum test, mais sur le mien il y a comme un léger probleme... il n'y a pas de scroll dans" contexte" > http://estreetest.superforum.fr/ ... c'est peut être un des seuls td ou j'ai besoin de scroll c'est dommage X'D

je vais essayer un peu ( je commence à savoir bidouiller les codes >_<  ) Je te passe cela ce week end au plus tard, avec tes conseils je devrais y arriver ^^ ( enfin j'espère  )

Encore merci de ton aide =)'

il te suffit d'ajouter un

Code:

overflow: auto;

aux cases que tu veux mais normalement avec ce css tu ne dois pas avoir de soucis.

Salut! =)

Alors j'ai réussis à bidouiller la chose, en fait comme je tente également de retravailler les codes de mon coté, j'ai du supprimer un "." dans les CSS... T_T donc maintenant je sais d'où vient le bug qui n'apparaît plus à l'heure actuel (lol)
Du coup j'ai réussis à faire la suite *.* Merci prof!

Je pense que la commande est finie =) ... quoi que, j'aurais peut être un petit détail MINUSCULE à te demander
* fait les yeux de chat potté *

En fait sur mon ancien fow j'avais réussis ( il y a un an... ) à créer des infos-bulles en passant la souris sur une image, je te laisse jeter un coup d'oeil sur ce screen:

Spoiler:

Comme tu peux le constater, à gauche l'image est normal.
Puis à droite, lorsque l'on passe le curseur sur l'une d'elle, nous avons une proposition de lien menant aux "Messages Privés"

Serait-il possible que tu me refasse le même code s'il te plais? :3 Promis c'est la dernière fois que je t'embête!
Juste, une petite amélioration à cette info-bulle :
serait-il possible d'avoir les mêmes couleurs que le code de la PA  ( #4b385a et #303b47 pour la bordure. )
Et pour les écris/liens:  " Admin : Message privé" ( ou alors juste une > mettre un lien ici )  ? =)

Je t'en serais vraiment très reconnaissante :3

Bonjour Estree !

Oui je peux te rajouter des infobulles si tu veux, mais redonnes moi le code si tu l'as modifié parce que sinon on va pas travailler sur le même et tu n'auras plus qu'à recommencer tes réglages x)

Oki ^^ merci encore une fois de ton aide =)"

Donc, voici le HTML:

Code:

<div class="total"><div id="bienvenue">Bienvenue sur Saint Seiya Conquest,  {USERNAME}</div>
<table cellspacing="12" align="center"><tr>

<td width= "50%" colspan="3"><div id="contexte"><h1>Contexte</h1><br />

> <a href="http://saintseiyaconquest.forumactif.org/t9-contexte-de-saint-seiya-conquest" class="postlink" target="_blank" rel="nofollow">Lire l'histoire? CLICK !< </a>
<br>
Nous sommes actuellement en l'an -435, une nouvelle guerre opposant les Greques vient juste de voir le jour, opposant Corynthe, Athènes et Spartes. Les tensions entre les hommes sont palpables et tandis que les humains se battent pour leur indépendance, les dieux Grec se battent pour regagner leur immortalité.
<br>
En effet, il y a maintenant neuf mois de cela, la guerre de l'Olympe opposant Athéna, Hadès et Poséidon se terminait dans le coeur de mont Olympe. Chacune des divinités s'opposant pour gagner une terre, leur suprêmatie et montrer l'étendu de leur pouvoir.
<br>
Hélas, suite à leur guerre et à cause de leur cupidité, les trois divinités ont bravés la loi de Zeus, le souverain de l'Olympes, invitant leur chevaliers, des humains au sein de la demeure des dieux.
<br>
Enragé et déçu après le comportement des trois membres de sa famille, Zeus ferma l'Olympe en y envoyant les derniers hommes survivants sur terre tandis que se dressa un conseil où toutes les divinités jugèrent le méfait de Hadès, Poséidon et Athènes. Suite à cela, l'on retira l'immortalités ainsi qu'une grande partie des pouvoirs au trois divinités en les envoyant sur terre.
<br>
Puisqu'ils désiraient tant se battre,  Zeus leur proposa de rester sur terre jusqu'à ce que l'un des trois déchus soit le vainceur de cette guerre. Cependant loin d'être aussi cruel, Zeus convoqua le dieu de la forge, Héphaïstos, pour lequel ce dernier devra envoyer trois objets magique, des artéfacts cachés, afin que les trois déités puissent se battre à armes égales.
<br>
Seulement ... que se passerait-il si les artéfacts divines tombaient entre les mains des hommes?
<br>
A vous de tracer votre chemin, de servir la cause la plus juste à vos yeux et surtout... Que brûle votre cosmos !

</div></td><td width= "25%"><div id="vie"><h1>Vie de forum</h1><br />

NOUVEAUTES ici


</div></td><td width= "25%"><div id="heros"><h1>Héros du forum</h1><br /><img src="http://img15.hostingpics.net/pics/740773caridd1.gif" /><br /><br /><img src="http://www.handicapzero.org/fileadmin/user_upload/VISUELS_RUBRIQUES/point_interrogation.gif" /><br /><br /><img src="http://www.handicapzero.org/fileadmin/user_upload/VISUELS_RUBRIQUES/point_interrogation.gif" /><br /><br /></div></td></tr>

<tr><td width= "20%"><div id="amis"><h1>Amis</h1><br /><a href="http://ssomega.bbactif.com/" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/697163omega.png" border="0" alt="" /></a><img src="http://www.ratdirectory.com/images/88x31.png" /><img src="http://www.ratdirectory.com/images/88x31.png" /><img src="http://www.ratdirectory.com/images/88x31.png" /><img src="http://www.ratdirectory.com/images/88x31.png" /><img src="http://www.ratdirectory.com/images/88x31.png" /></div></td><td width= "30%" colspan="2"><div id="liens"><h1>Liens utiles</h1><ul style="list-style-type: none; padding: 0;"><li>

<br>
 Voici les liens simplifieront ton inscription et ta découverte du forum ! ^^<br>

<br>• <a href="http://saintseiyaconquest.forumactif.org/t8-faq-lie-aux-jeu-de-role-aide-au-debutants?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Pour commencer: FAQ pour les nouveaux rollistes ! </a>
<br>
<br>• <a href="http://saintseiyaconquest.forumactif.org/t6-regles-du-forum?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Ensuite , voici les règles ! </a>
<br>
<br>• <a href="http://saintseiyaconquest.forumactif.org/t9-contexte-de-saint-seiya-conquest?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Pour bien assimiler le Background du forum, voici notre contexte actuel.</a>
<br><br>• <a href="http://saintseiyaconquest.forumactif.org/f21-geographie-et-chronologie?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Besoin d'informations géographiques ? Par ici les cartes !</a>
<br>
<br>• <a href="http://saintseiyaconquest.forumactif.org/f6-conquete?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Envie d'idées ou bien de contribuer à l'avancement des background du forum ? C'est ici !</a>
<br>
<br>• <a href="http://saintseiyaconquest.forumactif.org/f15-armures-des-camps-et-effectifs?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Venez choisir votre camp et votre armure ! </a>
<br><br>• <a href="http://saintseiyaconquest.forumactif.org/f4-le-hall-des-chevaliers?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Pour une inscription rapide, c'est par ici. </a>
<br>
<br>• <a href="http://saintseiyaconquest.forumactif.org/f5-place-publique?tid=d72c1b5241dbc89bd9e3576f86408a4f" class="postlink">Pour les annonces, c'est par là. </a>
<br>• N'oubliez pas de vous tenir au courant des nouveautés !
Le staff vous souhaites beaucoup de plaisir sur Saint Seiya Conquest RPG !

</div></td><td width= "40%"colspan="2"><div id="topsites"><h1>Top Sites</h1>
 <br>
<br>
<br><center>
<a href="http://www.root-top.com/topsite/azzare34/in.php?ID=8003">
<img src="http://img.root-top.com/topsite/azzare34/banner.gif" border="0" alt="manga topsite" title="manga topsite"></a>

<a href="http://www.root-top.com/topsite/velusia/in.php?ID=5380"><img src="http://img.root-top.com/topsite/velusia/banner.gif" border="0" alt="saint seiya conquest" title="saint seiya conquest"></a>

<a href="http://www.root-top.com/topsite/chenshen/in.php?ID=997"><img src="http://img.root-top.com/topsite/chenshen/banner.gif" border="0" alt="saint seiya conquest" title="saint seiya conquest"><br /></a>


</div></td></tr></table><div class="stafftotal"><span class="titrestaff">Staff :</span><div class=logostaff><a href="http://saintseiyaconquest.forumactif.org/u2contact" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/975800adminal.png" border="0" alt="" /></a>   Admin</div><div class=logostaff><a href="http://saintseiyaconquest.forumactif.org/u4contact" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/365455adminman.png" border="0" alt="" /></a> Admin</div><div class=logostaff><a href="http://saintseiyaconquest.forumactif.org/u3contact" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/586385adminag.png" border="0" alt="" /></a> Admin</div><div class=logostaff><a href="http://saintseiyaconquest.forumactif.org/u36" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/784938modoareus.png" border="0" alt="" /></a> Modo</div><div class=logostaff><a href="http://saintseiyaconquest.forumactif.org/u16" class="postlink" target="_blank" rel="nofollow"><img src="http://img15.hostingpics.net/pics/396721modoeryl.png" border="0" alt="" /></a> Modo</div>
</div><div style="float: right;"> <a/></div></div>

Et le CSS:

Code:

body {
background-color:#000000;
background-attachment:fixed;
background-image:url(http://img4.hostingpics.net/pics/7753199722.png);
background-repeat:no-repeat;
background-position: center top;
    }


/*PA*/



.total{ /*la page entière*/
    width : 100%;
    border : 2px solid #943F4B;
    font-family: TrebuchetMS;
    border-radius : 40px;}

table{ /*le tableau de deux lignes (ligne contexte et ligne amis)*/
  width: 100%;
  height: 90%;
  text-align: center;}

#bienvenue,#contexte,#vie,#heros,#amis,#liens,#topsites{
     width: 100%;
  border-radius: 20px;
  border:  2px solid #943F4B;
overflow: auto;
  padding: 2px;}

#bienvenue{
  height: 30px;
  padding: 5px;
  font-size: 28px;
  text-transform: uppercase;
  border : none;
  color: #943F4B;
 text-shadow: 4px 4px 3px #303b47;
  overflow: hidden;
rotate3d(150,50,180,angle) }

#contexte{
  height: 250px;
  background-color: #4B385a;}

#vie{
  height: 100%;
  background-color: #4B385a;}

#heros{
  height: 100%;
  background-color: #4B385a;}

#amis{
  height: 200px;
  background-color: #4B385a;}

#liens{
  height: 100%;
  background-color: #4B385a;
  font-size : 15px;
}

#topsites{
height : 100%
  background-color: #4B385a;}

.stafftotal{ /*la case qui entoure le staff*/
  width : 98%;
  height: 90px;
  border: 2px solid #943F4B;
  border-radius: 20px;
  margin-bottom : 10px;
  background-color: #4B385a;}

.logostaff{ /*les petites cases staff*/
  display: inline-block;
  width: 85px;
  height: 65px;
  border:  2px solid #943F4B;
  margin: 10px 2px 10px 2px;}

.titrestaff{ /*le titre "staff" tu peux le déplacer en changeant les chiffres "right" et "bottom"*/
 
 position: relative;
  right: 80px;
  bottom : 60px;
 font-size: 24px;
 color: #943F4B;
  text-shadow: 4px 4px 3px #303b47;
  text-transform: uppercase;
}

h1{ /*tous les autres titres*/
  margin: auto;
  width: 70%;
  padding: 10px;
 font-size: 18px;
 font-weight: normal;
text-transform: uppercase;
 border-bottom: 2px dashed #943F4B;
color: #943F4B;
 text-shadow: 5px 5px 2px #303b47;}

Voilà j'ai ajouté les infobulles, tu peux voir le résultat sur mon forum test :

http://cafeoletest.forumactif.org/

Par contre du coup les pseudos des membres du staff n'apparaissent nul part, c'est voulu ? Si tu veux je peux agrandir un chouïa les infobulles pour qu'on puisse y mettre le nom/prénom de chacun. Ce n'est qu'une proposition, c'est comme tu veux mais ça m'a perturbé en fait donc je te propose x)

Coucou ^^

C'est juste Ni-kel! *.* Comme toujours
* lui fait un câlin et lui apporte le ptit dej par transmission de pensée. *

En fait, pour les membres, ils auront leur noms en dessous des images, c'est prévu ^^ je le ferais une fois que j'aurais les infobulles, c'est le dernier détail à faire et comme c'est franchement pas compliqué à faire.... je le ferais XD'

Donc pas besoin de mettre le nom en infobulle =)
Par contre, je veux bien que tu fasses un agrandissement pour y mettre un "lien" au préalable qui mènera vers le profil de chacun. =) ( je le ferai également si tu n'y vois pas d'objection fufufu il faut bien que je fasse ma petite part du travail aussi x)' )

Pour bidouiller l'infobulle, il me semble que ce n'est que le HTML à traficoter pour ajouter le lien dedans ( me semble )
Bonne matinée et que Brûle ton cosmos!

Hellow :Pmerci pour le pti dej !

Je te donne les codes du coup. Je t'ai agrandis les infobulles mais si jamais tu as besoin d'adapter encore la taille jettes un oeil dans le CSS et tu verras que je t'ai mis un petit commentaire pour te dire ce qui doit être changé pour ça.

Ton lien doit se mettre dans le html oui, après pour bidouiller taille, placement, couleur et autre de l'infobulle c'est dans le css. Normalement mon code est assez clair, tu devrai t'y retrouver mais si ce n'est pas le cas tu sais où me trouver ^^

html :


css :

Tout est clair Merci beaucoup pour ton aide! =')
( oublies pas d'aller dévaliser une banque pour ta paie! XD )

Je ne sais pas si je dois garder ce topic ouvert ( comme je vais très certainement remanier du code pour créer ceci et cela
< https://www.never-utopia.com/t36119-template-css-un-corps-categorie
< https://www.never-utopia.com/t37592-template-css-categories-lumineuses )

Au pire des cas je pourrais t'envoyer un MP si j'ai un bug quelque part? :3

Bonjour :)

Bien sur tu pourras me contacter sans soucis, je passe sur Never Utopia tous les jours donc tu aura une réponse rapide. Je pense que tu peux faire fermer ce topic, la commande en elle-même est remplie et si après tu veux faire des modif ça entre dans le cadre d'une autre commande (m'enfin si tu bloques sur un truc que je peux faire rapidement je te répondrai par mp, je pense pas qu'on m'en tiendra rigueur, les modérateurs confirmeront ^^)