Espace entre le début de mon message et mon tableau

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

Résolu Espace entre le début de mon message et mon tableau

Message par Haileen le Mer 2 Mar 2011 - 3:02

    Bonsoir!
    Je viens de terminer un tableau et j'ai remarqué qu'un énorme espace séparait le début de mon message et mon tableau.

      • Image


      • HTML
    Code:
    <div style="text-align:center"><img src="IMAGE DE SON NOM EN AAAIIGHT! 45 #74899C"></div>
    <table width="100%"><tr><tr><td align="center" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3; border-top:1px solid #969BA3" colspan="2"><div style="background-color:#BCCDD9;"><br><img src="URL DE L'IMAGE" width="80%">
    <br></div></td></tr>
    <tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Signalement
    <br></div></td><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Carnet rose
    <br></div></td></tr>
    <tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Nom :</b>
    <b>Âge :</b>
    <b>Sexe :</b>
    <b>Race :</b>

    <b>Caractère :</b>
    <br></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Père :</b> <a href="LIEN DU BOX"></a>
    <b>Mère :</b> <a href="LIEN DU BOX"></a>
    <b>Père de la mère :</b> <a href="LIEN DU BOX"></a>
    <b>Produits</b>
    <a href="LIEN DU BOX"></a>
    <b>Prix de la saillie :</b>
    <br></div></td></tr>
    <tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Soins
    <br></div></td><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Signes de qualité
    <br><tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3" rowspan="2"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Vétérinaire :</b>
    <b>Maréchal-ferrant :</b>
    <b>Dentiste :</b>
    <b>Masso-thérapeuthe :</b>
    <b>Points bonus :</b>
    <br></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Stud-book :</b>
    <b>Qualité(s) certifiée(s) :</b>
    <br><tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Palmarès
    <br></div></td></tr>
    <tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Expérience
    <br></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><br><br><br><tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3" rowspan="2"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Expérience :</b>

    <div style="padding-left:15px"><b>Dressage :</b></div>
    <div style="padding-left:15px"><b>Saut :</b></div>
    <div style="padding-left:15px"><b>Show :</b></div>
    <br></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><br><br><br><br><tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><br><br><br><br></div></td></tr>
    <tr><td align="center" style="border:1px solid #969BA3" colspan="2"><div style="background-color:#C8D8E2; font-variant: small-caps;"><br>Photos
    <br></div></td></tr>
    <tr><td align="center" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3; border-bottom:1px solid #969BA3;" colspan="2"><div style="background-color:#BCCDD9;"><br><img src="URL DE L'IMAGE" width="80%">

    <img src="URL DE L'IMAGE" width="80%">

    <img src="URL DE L'IMAGE" width="80%">

    <img src="URL DE L'IMAGE" width="80%">

    <img src="URL DE L'IMAGE" width="80%"><br></div></td></tr></td></tr></table>

    Si vous pouviez également m'aider à faire mon tableau en CSS plutôt qu'avec du HTML uniquement, ce serait gentil. Merci! Very Happy


Dernière édition par Haileen le Mer 2 Mar 2011 - 4:18, édité 1 fois

Haileen
Nouveau membre

Messages : 17
Inscrit(e) le : 13/02/2011

http://evenconstruction.forumgratuit.be
Haileen a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par SoraNoHime le Mer 2 Mar 2011 - 3:23

Bonsoir,

dans quelle partie du corps du forum se trouve ce tableau ? un message en lui même, dans une annonce, le tableau des messages, le corps d'une catégories ? De l'emplacement dépend le visuel du tableau ^^

Une fois que vous aurez répondu à ceci, nous nous mettrons à la css ^^.

Cordialement.

SoraNoHime
+ Hyperactif +

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par Haileen le Mer 2 Mar 2011 - 3:30

    Dans un message. Smile

Haileen
Nouveau membre

Messages : 17
Inscrit(e) le : 13/02/2011

http://evenconstruction.forumgratuit.be
Haileen a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par SoraNoHime le Mer 2 Mar 2011 - 3:40

^^ Donc l'espacement est normal. car un message prend en compte les sauts de ligne. Il vous faut coller intégralement les parties du tableau pour qu'il n'y ait plus cet espace. Vous pouvez enlever également tous les
Code:
<br/>
qui seront remplacés par des sauts de lignes

Code:
    <div style="text-align:center"><img src="IMAGE DE SON NOM EN AAAIIGHT! 45 #74899C"></div>
    <table width="100%"><tr><tr><td align="center" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3; border-top:1px solid #969BA3" colspan="2"><div style="background-color:#BCCDD9;">
<img src="URL DE L'IMAGE" width="80%">
</div></td></tr>    <tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Signalement
</div></td><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Carnet rose
</div></td></tr><tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Nom :</b>
    <b>Âge :</b>
    <b>Sexe :</b>
    <b>Race :</b>

    <b>Caractère :</b></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Père :</b> <a href="LIEN DU BOX"></a>
    <b>Mère :</b> <a href="LIEN DU BOX"></a>
    <b>Père de la mère :</b> <a href="LIEN DU BOX"></a>
    <b>Produits</b>
    <a href="LIEN DU BOX"></a>
    <b>Prix de la saillie :</b>
</div></td></tr><tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Soins
</div></td><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Signes de qualité
<tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3" rowspan="2"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Vétérinaire :</b>
    <b>Maréchal-ferrant :</b>
    <b>Dentiste :</b>
    <b>Masso-thérapeuthe :</b>
    <b>Points bonus :</b>
    <br></div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Stud-book :</b>
    <b>Qualité(s) certifiée(s) :</b>
    <br><tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Palmarès</div></td></tr><tr><td align="center" style="border:1px solid #969BA3" width="50%"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Expérience
</div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;">


<tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3" rowspan="2"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;"><b>Expérience :</b>
<div style="padding-left:15px"><b>Dressage :</b></div>
    <div style="padding-left:15px"><b>Saut :</b></div>
    <div style="padding-left:15px"><b>Show :</b></div>

</div></td><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;">



<tr><td align="justify" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3"><div style="background-color:#BCCDD9; padding-left:25px; padding-right:15px; padding-top:10px;">



</div></td></tr>
    <tr><td align="center" style="border:1px solid #969BA3" colspan="2"><div style="background-color:#C8D8E2; font-variant: small-caps;">
Photos
</div></td></tr><tr><td align="center" style="border-left:1px solid #969BA3; border-right:1px solid #969BA3; border-bottom:1px solid #969BA3;" colspan="2"><div style="background-color:#BCCDD9;"><br><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"></div></td></tr></td></tr></table>

Je travaille sur votre css. vous avez bien accès à votre feuille CSS (en d'autres termes vous etes bien l'admin de ce forum ?)

SoraNoHime
+ Hyperactif +

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par Haileen le Mer 2 Mar 2011 - 3:45

    Oui oui, j'en suis l'administratrice! Smile
    Pour ce qui est de l'espace, il reste encore un petit vide mais ce n'est pas dérangeant, ce problème est donc résolu, merci!
    Et merci également de bien vouloir m'aider pour le css! Very Happy

Haileen
Nouveau membre

Messages : 17
Inscrit(e) le : 13/02/2011

http://evenconstruction.forumgratuit.be
Haileen a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par SoraNoHime le Mer 2 Mar 2011 - 4:10

Code:
.cadre1{
border-left:1px solid #969BA3;
border-right:1px solid #969BA3;
border-top:1px solid #969BA3;
}
.cadre2{
background-color:#BCCDD9;
}
.cadre3{
border:1px solid #969BA3;
}
.cadre4{
background-color:#C8D8E2;
font-variant: small-caps;
}
.cadre5{
border-left:1px solid #969BA3;
border-right:1px solid #969BA3;
}
.cadre6{
background-color:#BCCDD9;
padding-left:25px;
padding-right:15px;
padding-top:10px;
}
.cadre7{
padding-left:15px;
}
.cadre8{
border-left:1px solid #969BA3;
border-right:1px solid #969BA3;
border-bottom:1px solid #969BA3;
}
.cadre9{
background-color:#BCCDD9;
}

Voici css à mettre dans votre feuille. Je m'attaque au tableau ^^

En fait, il suffit de regrouper les
style="y"
que vous avez dans le tableau et de les transformer en
class="x"
et dans votre css noter
.x{y}
.

le x étant un nom que vous donner par genre de style utilisé, et le y ce que vous aviez mis dans votre style ^^

vous pouvez déjà copier coller le code que je vous ai donné plus haut.

Edit : voici votre tableau

Code:
<div style="text-align:center"><img src="IMAGE DE SON NOM EN AAAIIGHT! 45 #74899C"></div>
<table width="100%"><tr><tr><td align="center" class="cadre1" colspan="2"><div class="cadre2">
<img src="URL DE L'IMAGE" width="80%">
</div></td></tr><tr><td align="center" class="cadre3" width="50%"><div class="cadre4">
Signalement
</div></td><td align="center" class="cadre3" width="50%"><div  class="cadre4">
Carnet rose
</div></td></tr><tr><td align="justify" class="cadre5"><div class="cadre6"><b>Nom :</b>
<b>Âge :</b>
<b>Sexe :</b>
<b>Race :</b>

<b>Caractère :</b></div></td><td align="justify" class="cadre5"><div class="cadre6"><b>Père :</b> <a href="LIEN DU BOX"></a>
<b>Mère :</b> <a href="LIEN DU BOX"></a>
<b>Père de la mère :</b> <a href="LIEN DU BOX"></a>
<b>Produits</b>
<a href="LIEN DU BOX"></a>
<b>Prix de la saillie :</b>
</div></td></tr><tr><td align="center" class="cadre3" width="50%"><div class="cadre4">
Soins
</div></td><td align="center" class="cadre3" width="50%"><div class="cadre4">
Signes de qualité
<tr><td align="justify" class="cadre5" rowspan="2"><div class="cadre6"><b>Vétérinaire :</b>
<b>Maréchal-ferrant :</b>
<b>Dentiste :</b>
<b>Masso-thérapeuthe :</b>
<b>Points bonus :</b>
</div></td><td align="justify" class="cadre5"><div class="cadre6"><b>Stud-book :</b>
<b>Qualité(s) certifiée(s) :</b>
<tr><td align="center" class="cadre3" width="50%"><div class="cadre4">
Palmarès</div></td></tr><tr><td align="center" class="cadre3" width="50%"><div class="cadre4">
Expérience
</div></td><td align="justify" class="cadre5"><div class="cadre6">


<tr><td align="justify" class="cadre5" rowspan="2"><div class="cadre6"><b>Expérience :</b>
<div class="cadre7"><b>Dressage :</b></div>
<div class="cadre7"><b>Saut :</b></div>
<div class="cadre7"><b>Show :</b></div>

</div></td><td align="justify" class="cadre5"><div class="cadre6">



<tr><td align="justify" class="cadre5"><div class="cadre6">



</div></td></tr>
<tr><td align="center" class="cadre3" colspan="2"><div class="cadre4">
Photos
</div></td></tr><tr><td align="center" class="cadre8" colspan="2"><div class="cadre9"><br><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"><img src="URL DE L'IMAGE" width="80%"></div></td></tr></td></tr></table>

SoraNoHime
+ Hyperactif +

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par Haileen le Mer 2 Mar 2011 - 4:14

    Les tableaux tout fouillis à cause de tout ces codes HTML sont derrière moi, ahah, merci énormément! Very Happy
    Puis ça va beaucoup m'aider pour ce que je dois faire par la suite. Smile

Haileen
Nouveau membre

Messages : 17
Inscrit(e) le : 13/02/2011

http://evenconstruction.forumgratuit.be
Haileen a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par SoraNoHime le Mer 2 Mar 2011 - 4:17

Je vous en prie. Hésitez pas s'il y a un problème ^^. Bonne nuit à vous.

SoraNoHime
+ Hyperactif +

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

http://fanasiacodes.bbfr.net/
SoraNoHime a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Espace entre le début de mon message et mon tableau

Message par Haileen le Mer 2 Mar 2011 - 4:18

    Je n'hésiterai pas! Puis encore merci de votre rapidité et tout et tout, vous m'avez fort aidé! Bonne nuit! Smile

Haileen
Nouveau membre

Messages : 17
Inscrit(e) le : 13/02/2011

http://evenconstruction.forumgratuit.be
Haileen a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum