Nettoyer un code & double casier

[Keith8D]

Bonjouuur
J'aimerais "nettoyer" mon code afin qu'il soit plus lisible pour les membres de mon forum.
Seulement je vois pas comment faire plus court, enfin bon, si quelqu'un voit des raccourci possible.. :D
Sinon j'aurais bien voulu voir ce que donnerais la fiche si le casier "description physique" et celui "description morale" étaient l'un à côté de l'autre [et ça, j'sais pas faire x)]

Code:

<div style="border: 5px solid #C7BF9D ; text-align: justify;"><blockquote> <div style="text-align: center" align=center><span style=font-georgia: Palatino Linotype><font face=Georgia size=7>[color=#C7BF9D]<blockquote>
Prénom[s]
[color=#8C8253][i]& nom[/i][/color][/color]</font></span></div>

<center><div style="width: 600px; background-color: #463B2F;border: 5px solid #8C8253; -moz-border-radius:20px"><div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;"><table><td>[img]http://img4.hostingpics.net/pics/249579HaineStrayDogbyWiseKumagoro.jpg[/img]</td><td><div style="text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-ÉTAT CIVIL-</div> <div style="color : #C7BF9D; font-size: 15px; height: 3px; -moz-border-radius:8px">Nom:
Prénom:
Date de Naissance:
Nationalité:
</div>




<div style="text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-BIOGRAPHIE-</div>
<div style="border: double #C7BF9D; width:370px;height:130px;overflow:auto;background-color:#352F28; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah [/justify][/size]</div><center>

<select name="wxlmenu" size=1 style="font-family: arial; color: white; border: double #C7BF9D;-moz-border-radius:8px; font-size: 12; padding:3px; background-color: #352F28;"><div style="border: double #C7BF9D;"><option>Sélectionnes ton statut:</option>
<option>Caïnite</option>
<option>Infant</option>
<option>humain</option></select></center></td></table></div></div></blockquote>

<blockquote><center><div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]-DESCRIPTION PHYSIQUE- [/size]</div>
<div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">
<div style="padding-left:35px;padding-right:15px"><div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah[/justify][/size]</div><br><div style="text-align:left; color: #C7BF9D; font-size: 15px;">Taille:
Poids:</div></br></blockquote>
<blockquote><center><div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]-DESCRIPTION MORALE- [/size]</div>
<div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">
<div style="padding-left:35px;padding-right:15px"><div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah[/justify][/size]</div><br><div style="text-align:left; color: #C7BF9D; font-size: 15px;">Philosophie du personnage : [une citation, une expression résumant votre personnage]
</div></br></blockquote>
</div></center>

[ge80]

Bonjour

Vous pouvez faire plus court en utilisant votre feuille de style.


Savez vous le faire ou avez vous besoin d'aide pour le construire (si cette piste vous convient )?

cordialement
ge

[Keith8D]

Oooow *se sent trop naz*
Oui j'pense que j'aurais besoin d'aide é__è

[ge80]

Ok je vous proposerai une solution.

Une dernière question

J'aimerais "nettoyer" mon code afin qu'il soit plus lisible pour les membres de mon forum.

Dans quel but cette meilleure lisibilité ?
Code à recopier ou à comprendre par vos membres !

[Keith8D]

Merci

C'est un code de feuille de présentation, j'aurais voulu le simplifier au maximum afin que même les membres les moins expérimentés arrivent à le remplir sans se perdre.

[ge80]

OK

Alors je vais vous proposer une solution.


Certainement une réponse demain matin

[Keith8D]

Ok merci beaucoup

[Par contre je suis en internat, si je n'ai pas accès au net demain après midi je ne l'aurait pas avant vendredi soir :/ mais du coup ça vous laisse plus de temps o/]

[ge80]

Merci :

dans ce cas vous l'aurez pour vendredi

Cool

[ge80]

Bonjour

Voici le nettoyage.

J'ai aéré le code.
Il vous reste à supprimer les passages à la ligne inutiles.

Code:

<blockquote><div style="border: 5px solid #C7BF9D ; text-align: center;">
<center>
<div style="text-align: center"><span><center><div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]--Prénom[s] [i]& nom[/i]- [/size]</div></center></span></div>

<div style="width: 600px; background-color: #463B2F;border: 5px solid #8C8253; -moz-border-radius:20px">
<div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">

<table><tr>
<td>[img]http://img4.hostingpics.net/pics/249579HaineStrayDogbyWiseKumagoro.jpg[/img]</td>
<td>
<div style="text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-ÉTAT CIVIL-</div>
 
<div style="color:#C7BF9D; font-size: 15px; -moz-border-radius:8px">Nom:
    Prénom:
    Date de Naissance:
    Nationalité:
</div>
---------
---------
---------
---------
---------
---------
---------
<div style="text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-BIOGRAPHIE-</div>
---------
<div style="border: double #C7BF9D; width:370px;height:130px;overflow:auto;background-color:#352F28; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
 [/justify][/size]</div>
............
<select name="wxlmenu" style="font-family: arial; color: white; border: double #C7BF9D;-moz-border-radius:8px; font-size: 12; padding:3px; background-color: #352F28;">
<div style="border: double #C7BF9D;"><option>Sélectionnes ton statut:</option>
    <option>Caïnite</option>
    <option>Infant</option>
    <option>humain</option></div>
</select>
</td>
</tr>
</table>
</div>
</div>

<div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]-DESCRIPTION PHYSIQUE- [/size]</div>
    <div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">
    <div style="padding-left:35px;padding-right:15px">
   <div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
[/justify][/size]
</div>
</div>
</div>


<div style="text-align:left; color: #C7BF9D; font-size: 15px;">Taille:
    Poids:</div>

<div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]-DESCRIPTION MORALE- [/size]</div>
    <div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">
    <div style="padding-left:35px;padding-right:15px">
   <div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
[/justify][/size]
</div></div></div>


<div style="text-align:left; color: #C7BF9D; font-size: 15px;">Philosophie du personnage : [une citation, une expression résumant votre personnage]</div>


</center>
</div></blockquote>

[Keith8D]

Merciii o/
Pourrais-tu m'indiquer comment mettre les casiers "description physique" et "description morale" l'un à coté de l'autre stp? avec un espace entre de quelques pixels si possible :D

[ge80]

Dans ce cas il faut modifier l'organisation complète de cette partie.

Je vais faire des essais.

[Keith8D]

ok merci :o

[ge80]

Votre codage devient trop lourd.
Il faudrait utiliser la feuille de style si vous pensez utiliser plusieurs fois cette disposition.

Vos définitions forcées de hauteur et largeur perturbent l'affichage.

Voici ce que cela donne à l'état brut.

Code:

<blockquote><div style="border: 5px solid #C7BF9D ; text-align: center;">
<center>
<div style="text-align: center"><span><center><div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 25px; color: #ffffff;">[size=20]--Prénom[s] [i]& nom[/i]- [/size]</div></center></span></div>

<div style="width: 600px; background-color: #463B2F;border: 5px solid #8C8253; -moz-border-radius:20px">
<div style="padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;">

<table><tr>
<td>[img]http://img4.hostingpics.net/pics/249579HaineStrayDogbyWiseKumagoro.jpg[/img]</td>
<td>
<div style="height:20px; text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-ÉTAT CIVIL-</div>
<div style="color:#C7BF9D; font-size: 15px; -moz-border-radius:8px">Nom:
                  Prénom:
                  Date de Naissance:
                  Nationalité:
</div>
<div style="height:20px; text-align:center; color: #C7BF9D; font-size: 20px; font-family: Georgia;font-style:italic;">-BIOGRAPHIE-</div>

<div style="border: double #C7BF9D; width:370px;height:130px;overflow:auto;background-color:#352F28; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
 [/justify][/size]</div>
............
<select name="wxlmenu" style="font-family: arial; color: white; border: double #C7BF9D;-moz-border-radius:8px; font-size: 12; padding:3px; background-color: #352F28;">
<div style="border: double #C7BF9D;"><option>Sélectionnes ton statut:</option>
    <option>Caïnite</option>
    <option>Infant</option>
    <option>humain</option></div>
</select>
</td>
</tr>
</table>
</div>
</div>
</center>

<table border="2"><tr><td width="50%" align="center"><div style="background-color: #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 30px; color: #ffffff;">[size=20]-DESCRIPTION PHYSIQUE- [/size]</div> </td><td width="50%" align="center"><div style="background-color:  #8C8253; text-align: center; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; width: 300px; heigth: 30px; color: #ffffff;">[size=20]-DESCRIPTION MORALE- [/size]</div></td></tr><td>  <div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">    <div style="padding-left:35px;padding-right:15px">   <div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah [/justify][/size]</div></div></div><div style="text-align:left; color: #C7BF9D; font-size: 15px;">Taille:
    Poids:</div></td><td>    <div style="color: #364449; border: 3px solid #C7BF9D; width: 360px; text-align: justify; -moz-border-radius: 15px; padding-left: 15px; padding-right: 20px; padding-top: 20px; padding-bottom: 20px; text-align:center; color: #C7BF9D; font-size: 11px;">    <div style="padding-left:35px;padding-right:15px">   <div style="border: double #C7BF9D; width:300px;height:150px;overflow:auto;background-color:#463B2F; color: #C7BF9D;">[justify][size=15]blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
blah blah blah blah blah blah blah blah
[/justify][/size]
</div></div></div>
<div style="text-align:left; color: #C7BF9D; font-size: 15px;">Philosophie du personnage : [une citation, une expression résumant votre personnage]</div></td></tr></table>

</div></blockquote>

[Keith8D]

Merci beaucoup pour ton aide, je vais me débrouiller avec ça
Bonne soirée~

[ge80]

Bonne continuation

Vous utilisez plusieurs fois la même mise en forme et une classe CSS pourrait vous alléger énormément votre codage.

A votre disposition pour une illustration.

Bonne soirée
Ge